DIV中的中心图像

时间:2013-11-19 15:17:41

标签: image html center

CSS:

overlay { 
  height: 100%; 
  width: 100%; 
  position: absolute; 
  top: 0px; 
  left: 0px; 
  z-index: 99999; 
  background-color:black; 
  filter: alpha(opacity=75); 
  -moz-opacity: 0.75; 
  opacity: 0.75; 
}
overlay h2 { 
  position: fixed; 
  margin-left: 40%; 
  top: 40%; 
  font-size: 1.75em; 
  font-weight:700; 
  color:#EF9C00;
}

HTML:

<div id="overlay"><h2>Loading.. Please wait</h2></div>

我想将loader.png直接显示在下一行居中的单词下面。 我尝试的所有东西似乎都把图像放在文本上或右边!

由于

1 个答案:

答案 0 :(得分:1)

正确的img loading:

<div id="overlay"><h2>Loading.. Please wait <img src="http://jimpunk.net/Loading/wp-content/uploads/loading23.gif" /></h2></div>

添加此css

#overlay  img {
  vertical-align:middle;
}

下一行以img loading:

为中心
<div id="overlay">
  <h2>
    Loading.. Please wait <br /><img src="http://jimpunk.net/Loading/wp-     content/uploads/loading23.gif" />
  </h2>
</div>

添加此css

#overlay h2 { 
      text-align:center;
}