日期:2014-05-17  浏览次数:20648 次

css学习笔记
1.float定义的元素起的作用是,使跟在后面的元素知道这个元素是否处于float状态。
"clear:both"清楚浮动元素的特性
div1(float)浮动起来,div2如果没有浮动则会在被div1盖住,通过添加
<div style="clear:both"></div>,可以使div1后面的元素识别出块,换行显示。

<div class="1"> 1231</div>
<div style="clear:both"></div>
<div class="2"> 456</div>

2.overflow描述如果内容超过自身将如何处理。
这个属性定义溢出元素内容区的内容会如何处理。

值 描述
visible 默认值。内容不会被修剪,会呈现在元素框之外。
hidden 内容会被修剪,并且其余内容是不可见的。
scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。

3.line-height:ine-height 属性设置行间的距离(行高)。

4.使块元素水平居中
margin:0 auto;
其实就是
margin-left: auto;
margin-right: auto;
这个技巧基本上所有的 CSS 教科书都会有说明,别忘记给它加上个宽度。Exploer 下也可以使用
body{
    text-align: center;
}
然后定义内层容器text-align: left;

body { text-align: center } #content { text-align: left; width: 700px; margin: 0 auto }

5. 用CSS来处理垂直对齐

垂直对齐用表格可以很方便地实现,设定表格单元 vertical-align: middle 就可以了。但对CSS来说这没用。如果你想设定一个导航条是2em高,而想让导航文字垂直居中的话,设定这个属性是没用的。

CSS方法是什么呢?对了,把这些文字的行高设为 2em:line-height: 2em ,这就可以了。