css学习随笔

清除浮动

一般会再body的底部再加一个div，里面不用放内容

<div class="clr">

</div>

样式：

.clr{

     clear:both;

     width:0px;

     height: 0px;

}

margin：层的边框以外留的空白background-color：背景颜色background-image：背景图片padding：层的边框到层的内容之间的空白 border：边框 content：内容

用ul li ul li做二级目录的时候，展开的二级目录默认都是右偏的，这时只要把二级目录的ul的padding属性设置为0px就能使其与一级目录垂直了。

<pre></pre>标签是输入的文字是怎么样显示的就是怎么样，有换行就换行显示。

html解决网页居中，两边留白

body下放个div,设置这个div的样式为：width(自己给它定宽)；margin:0 auto;

特别需要注意的一个问题，我在这个坑上耗了两个小时，问了大神才知道原因

问题：

<strong><div class="page"><div class ="logo"><img src="./images/HZByte.png" class="clearfix"><ul class="clearfix"> <li><a href="#">登录</a></li><li><a href="#">注册</a><li></ul></div></div></strong>

我想要文字和图片底部对齐，但是无论怎么改文字高度都不行

原因：

我li设置了右浮，这样ul的height为0，所以li无法进行高度修改

解决：

给ul加一个class="clearfix"

clearfix的样式为：

<span style="font-size:12px;">.clearfix:after{content: ".";height: 0;display: block;clear:both;visibility: hidden;}</span>

然后给li设置line-height为图片高度。