本章学习两个非常重要的元素<div>和<span>。要注意的是在页面中使用<div>的时候,不要滥用。学习块元素居中的方法,子孙选择符,缩写形式以及伪类。在最后介绍了“层叠”的内容。本章内容较多且很重要,需要复习巩固多加练习。
要点:
1、<div>元素用来把相关的元素组成逻辑部分。
2、创建逻辑部分有助于标识页面的主内容区、标题和页脚。
3、可以用<div>元素把需要相同样式的元素组成一组。
4、用嵌套的<div>元素给文件添加更深一层的结构,这样有利于结构清晰和样式设计。不过除非真的需要,否则不要轻易添加结构。
5、用<div>元素把几部分内容组成一组,就可以跟其他块元素一样给它设计样式。例如,可以用border属性给一组被<div>包围着的元素添加边框。
6、width属性用来设置元素内容区的宽度。
7、一个元素的总宽度等于内容区的宽度加上所有补白、边框和边界的宽度。
8、一旦设置了一个元素的宽度,它就不再随浏览器窗口的宽度变化而伸缩了。
9、text-align是一个用于块元素的属性,可以使块元素中的所有内联内容居中。它可以被任何嵌套的块元素继承。
10、可以用子孙选择符选择嵌套在其他元素中的元素,例如,子孙选择符 div h2 { … } 选择所有嵌套在<div>元素中的<h2>(包括孩子,孙子等)。
11、可以用缩写方式定义相关的属性。例如,padding-top, padding-bottom,padding-left都是关于padding的属性,可以用一个缩写定义,padding。
12、padding,margin,border,background和font属性都可以用缩写规则指定。
13、<span>内敛元素跟<div>元素一样:它用来把相关的内敛元素和文本组成一组。
14、跟<div>一样,也可以把<span>元素添加到类中(或者给<span>元素设置唯一的id)来给它们设计样式。
15、<a>元素是有不同状态的元素的一个例子。<a>元素主要的状态有unvisited,visited和hover。
16、可以用伪类单独地给每个状态设计样式。伪类和<a>元素一起最常用的是: :link,用于未被访问的链接, :visited,用于已经访问的链接, :hover,用于停留状态。
17、其他元素支持 :hover伪类,一些浏览器也支持 :first-child, :active, :focus伪类用于其他元素。
我买了本 Head First JavaScript 看了好快,一个星期的样子就看了一半了,内容好简单…
我看的这本书也是看的很快,就第11、12章讲高级网站构建和布局和排版内容多了一些。作为入门书感觉还是很不错的~入门后再看其他CSS的书 😳
看到一半,就停滞了,还没看完。。。