css+div小知识点

0.body里设置一个div包含所有的div,并把最外层的这个div命名为container,设置margin:0;padding:0;
1.先搭结构,在写样式,比如:最外面一个div,里面在套多少个div,左浮动,右浮动...
2.切图原则:图片越小越好(加载速度快)
3.块级元素经常通过左右浮动来进行水平排列
(1)为了保证在各个浏览器中,多个div在同一行水平排列而不会出现交叉部分,可以把每一个div都设置一个float:left的属性
(2)水平居中的属性
   margin:0 auto; //上下为0,左右自动


(3).news a:link,.news a:visited{color:#666;text-decoration:none;}
   .news a:hover{text-decoration:underline;}
(4)把溢出div框的部分隐藏
   overflow:hidden 
Q&A
  1.问题:用filebug查看,出现元素的css样式被划掉
    分析:子元素的权限不够(定义子元素时没有带着父元素)
    解决:.a{background-color:red}-->.news a{background-color:red}//带着父元素就可以了
(4)引入背景图片,并水平方向重复(repeat-x背景图片水平方向重复)
#foot{width:100%;height:310px;background:url(/images/foot_bg.png) repeat-x #898989;}
背景图片不铺是:no-repeat
(5)a链接水平排列
li{float:left}
(6)把a标签变块级元素并水平排列
a{width:20px;height:20px;display:block;float:left} //可以用来显示并排的小图标
(7)css精灵 一些图标可以合并为一张图,比起传统的切图,加载速度更快
(8)出现某个div没有显示背景颜色,可能是它前面的div没有设置高度或者宽度.
(9)一般情况下,上面的div浮动后,下面的div就会占据它的位置,为了清除这种影响,可以使用clear:xxx这个属性,xxx代表both,left,right...,表示清除上面对象左右浮动对我的影响,左浮动,右浮动对我的影响
技巧:当浮动了很多元素之后,突然需要另起一行时,可以制作一个空白的div标签,为其设置clear:both;属性,清除上面div左右浮动对自己造成的影响.
(10)文本居中对齐 
text-align:center
(11)内边距:加了内边距,div会增加内边距的宽度或高度,父div应该减去相应的内边距的宽度或高度,不然可能会出现div下掉的情况
(12)行高(行间的距离) line-height:xxpx;