即使很忙很忙,也请你放下手中的事,抽出一点时间,来总结一下过往的点点滴滴。
这篇文章是我近两天看了“网易云课堂”的心得,记录下来留作以后可以回顾。我在GitHub上也有上传代码:源码地址
我本身是一个PHPer,所以稍微复杂一点的Html和Js就晕乎乎的,大致的解题思路我其实非常清楚,但一遇到Css我就迷糊。相对定位、绝对定位、样式继承、浮动等等吧
首先说一下基础类型选择器。
包括标签选择、ID选择、class选择,在开发中,我们也会遇到一个标签应用多种样式的情况,比如:<div class="circle font-32"></div>
这里其实就是类选择器,多个类之间使用空格隔开。在比如在Css文件中会经常看到这样的代码:body,ul,ol{margin:0px; padding:0px}
,多个标签选择器见使用逗号隔开,表示每个标签都应用这样的样式;又或者.circle ul
表示class=“circle”
下的ul标签应用的样式,这中带有层级关系的样式,也使用空格进行分割。
其次就是在开发的过程中,经常会忽略margin个padding的占位,导致div换行显示。实际一个div的大小其实为:margin + padding + width;
在其次就是一些小的细节:比如外边距的合并,在一个元素出现在另一个元素的上边时,第一个元素的下外边距与第二个元素的上外边距会发生合并;在float操作之后,一般都会追加一个<div style="clear:both;">
来消除浮动的影响;
最后总结一下居中的使用:一、要求字体的line-height等于div的height,这样可以做到垂直剧中;二、使用margin:0px auto也可以做到div水平居中