这一章节讲了以下内容:
<div>
和 <span>
,使用这两个 element 可以使得 HTML 有更加 serious 的 supporting structure.<div>
<div>
什么时候发挥作用呢,是为了存在 logical sectons 的时候,并且要为这个 section 设置一些参数的时候使用。它也可以用于分清页面的内容结构,使得页面更加容易理解其大致的框架。
步骤如下:
<div>
s to mark sections: 这里需要注意的是,<div>
包括起来的是一个 block element ,所以有 opening tag, 也有 closing tag:</div>
<div>
s :通过在<div>
中添加 id=“” 或者 class=“”,以便以后在 CSS 中设计其 style。<div>
段落为菜单的样式:在这本书中,为了能够将段落有 order 的样子,于是对其 CSS 添加了一些style,这些 style 具体如下:
<div>
中的 inline element, 不仅仅包括 text,也会包括 img.<div>
的所有<h1>
的颜色,但是我们不想改变文章其他部分<h1>
的属性,同时,如果设置id,class就太繁琐,这个时候可以使用 descendents,在 CSS 中这样写: div h1{ color:black;} 这里 div是parent name,h1 是child name,中间用空格隔开。原来是这样的:
padding-top:0px;
padding-right:20px;
padding-bottom:10px;
padding-left:0px;
或者这样:
`margin-top:0px;
margin-right:20px;
margin-bottom:10px;
margin-left:0px;
现在只需要这样:
margin:top right bottom left;
如果两个对边相等,
可以这样:
margin:top,right;
如果四个相等,
可以
margin:20px;
boder 有很多参数,比如:
background 有很多参数,比如:
现在可以这样写:
background white url(images/cocktail.gif) repeat-x;
font 的 property 的设置有顺序:
font:
<span>
<span>
用于inline element,把它们弄成一个 package ,<div>
是用于 block element 的。
<a>
element 的 psedo-class<a>
element 有五个psedo-class:
可以在 CSS 中对其设置相应的参数,比如当 hover 时,字体变成黄色:
a:hover
{ color:yellow;
}
这里的psedo-class 有两个特性:
当 Browser 打开一个网页的时候,可以存在多个 CSS 文件:包括 author 的,visitor 的 和 browser default 的。这时,因为对一个段落可能被很多 CSS 文件当作 selector,所以需要经过一系列的 sorting ,找到 more specific 的那一个,来用于显示,主要的步骤如下:
通过三位数确定:000 :