你id为default的元素下调用的时候class="head"就是调用#default .head。。class=headbg就是#default .headbg的样式。。
这两个有什么不同嘛,.headbg是Y平铺,.head是X平铺,,,X是横向,Y是纵向。多了高度,多了一个,定位。
垂直居中问题css
-----------------------------
虽然css有一个垂直居中属性,CSS垂直居中属性不能决绝如下问题:
存在的问题:
*
已知div高度
*
div动态内容,不确定高度
*
想要内容垂直居中
*
不用table
在IE下:
位于相对容器的一半高度.
div内容所占有的高度默认设置为div高度
在标准浏览器中如:Mozilla,
Opera,
Safari
等等是完全不同的.
div被当做一个table
被现实出来.
<!DOCTYPE
HTML
PUBLIC
"-//W3C//DTD
HTML
4.01//EN">
<html>
<head>
<title>Universal
vertical
center
with
CSS</title>
<style>
.greenBorder
{border:
1px
solid
green}
</style>
</head>
<body>
<div
class="greenBorder"
style="display:
table
height:
400px
#position:
relative
overflow:
hidden">
<div
style="
#position:
absolute
#top:
50%display:
table-cell
vertical-align:
middle">
<div
class="greenBorder"
style="
#position:
relative
#top:
-50%">
any
text<br>
any
height<br>
any
content,
for
example
generated
from
DB<br>
everything
is
vertically
centered
</div>
</div>
</div>
</body>
</html>
在浏览器中显示:
any
text
any
height
any
content,
for
example
generated
from
DB
everything
is
vertically
centered