Text Overlay with Bootstrap Doubt

Question

Text Overlay with Bootstrap Doubt

Navigation

#1 by (1 votes)

5

I'm trying to make a text overlay on an image with the bootstrap, but I'm not getting it.

Would anyone know how to do it and help me?

My code is:

<section class="container">
  <div class="row ptf">
   	<div class="col-sm-4">
    	<img src="imagens/evidence.png" class="img-responsive" />
    </div>
    <div class="col-sm-4">
    	<img src="imagens/evidence.png" class="img-responsive" />
    </div>
    <div class="col-sm-4">
    	<img src="imagens/evidence.png" class="img-responsive" />
    </div>
  </div>
</section>

jquery twitter-bootstrap

asked by anonymous 27.01.2015 / 16:51

1 answer

Is there any way to create a moip account by api from moip? Including in the APK an SQLite database

score 1 · Answer 1

You can do this:

.image {
  position: relative;
  width: 100%;
}
h2 {
  position: absolute;
  top: 200px;
  left: 0;
  width: 100%;
}
h2 span {
  color: white;
  font: bold 24px/45px Helvetica, Sans-Serif;
  letter-spacing: -1px;
  background: rgb(0, 0, 0);
  /* fallback color */
  background: rgba(0, 0, 0, 0.7);
  padding: 10px;
}

<div class="image">
  <img src="http://lorempixel.com/image_output/people-q-g-640-480-10.jpg"alt="" />
  <h2>
    <span>Vamos Ajudar!<span class='spacer'></span><br />
    <span class='spacer'></span>doe alimentos e não cachaça!</span>
  </h2>
</div>