重拾css(2)——带着问题出发

来不及解释,快上车… …

  1. 有些浏览器不完全支持css3,现在可以用哪个工具去检测浏览器是否支持,以及支持哪些项?

  2. 常用的html标签,它们的display属性一般默认为block和inline。有哪些常用标签的display不是block和inline,这些标签显示的时候和block/inline有何区别?

  3. 是否了解@import?

  4. 一个表格的第一行显示红色背景,最后一行显示蓝色背景,中间行使用灰色/白色间隔的背景,如何写?

  5. 伪元素 ::before、::after 是否用过?都是在哪些地方用的?

  6. css——层叠样式表,其中的“层叠”该如何理解?

  7. 对“特指度(specificity)”了解多少,知道“I-C-E”的计算规则吗?

  8. 特指度理解不是很麻烦,关键是分析多个css选择符和计算麻烦。有一个简单的解决方案,四句口诀,叫做“查理版简单层叠要点”,是否了解?

  9. 搜索“浏览器默认样式”,找到它,打开看看,里面是浏览器默认的所有样式,你是否都能看得懂?

  10. 在你开发系统的第一个css文件的第一行,就要写上 * {margin:0; padding:0} ,这是为何?

  11. 样式 p{margin-top:50px; margin-bottom:30px;} 将会导致p之间的垂直距离是多少?

  12. “盒子模型”大家都了解了(不知道赶紧去恶补!!),盒子模型的width其实是指内容的宽度,不包括padding、border、margin。其实这样对我们做css布局是很不利的,有什么方法可以让width是全部的宽度?

  13. float的一些影响会让我们经常哭笑不得(特别是初学者),其实了解了float的设计初衷,也许你就会理解这些东西。float的设计初衷是什么?

  14. float具有“包裹性”——例如:<p>abc</p> 和 <p style=’float:left’>abc</p> 两者的宽度是不一样的,不信可以为 p 加上背景色试试。是否理解这种“包裹性”?试着想想,还有哪些元素(或css属性)也有这种“包裹性”?

  15. float还有一个表象是“破坏性”,它会导致父元素高度塌陷,这个大家应该都知道吧?那么这是为何呢?另外,还有哪个css属性,也导致这种“破坏性”?

  16. css清除浮动有三种方法,是否知道。你平时是怎么清除浮动的?业内最常用的经典清除浮动样式是什么?

  17. 相对定位relative如何理解,它和绝对定位absolute的最根本区别是什么?

  18. “定位上下文”是否知道?

  19. 经典的网页三列布局如何实现?如果不考虑IE6、7,最好的实现多列布局的方式是什么?

  20. 是否用过inline-block,IE6、7如何兼容?

    原文作者:Jerry
    原文地址: https://segmentfault.com/a/1190000009739034
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞