[b]CSS[/b]
[b]CSS 简介[/b]
CSS 指层叠样式表 (Cascading Style Sheets)
[b]CSS 语法[/b]
以分号结束
CSS 对大小写不敏感。不过存在一个例外：如果涉及到与 HTML 文档一起工作的话，class 和 id 名称对大小写是敏感的。
[b]CSS 属性选择器[/b]
[attribute] 用于选取带有指定属性的元素。
[attribute=value] 用于选取带有指定属性和值的元素。
[attribute~=value] 用于选取属性值中包含指定词汇的元素。
[attribute|=value] 用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
[attribute^=value] 匹配属性值以指定值开头的每个元素。
[attribute$=value] 匹配属性值以指定值结尾的每个元素。
[attribute*=value] 匹配属性值中包含指定值的每个元素。
[b]CSS 框模型[/b]
[img]http://dl2.iteye.com/upload/attachment/0119/8143/33ef7e59-8150-3f17-a7fb-d9bfd0d8a7c3.gif[/img]
元素框的最内部分是实际的内容
直接包围内容的是内边距
内边距呈现了元素的背景
内边距的边缘是边框
边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素。
在 CSS 中，width 和 height 指的是内容区域的宽度和高度。
增加内边距、边框和外边距不会影响内容区域的尺寸，但是会增加元素框的总尺寸。
外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。
合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
[b]CSS 浮动[/b]
浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。
由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。
[b]行框和清理[/b]
行框就是以块级标签定义的元素,内容可以是一个多行显示的内容
块级标签定义的元素在文档流中是独占一行的,就是说如果内容不足以占完一行(一块),后面的内容也不会占用剩下的空间
行内块级元素是会占用剩余空间进行内容显示的
浮动框旁边的行框被缩短，从而给浮动框留出空间，行框围绕浮动框。
[b]伪类和伪元素的区别[/b]
CSS 伪类用于向某些选择器添加特殊的效果。
CSS 伪元素用于将特殊的效果添加到某些选择器。
[b]伪类种类[/b]
[img]http://dl2.iteye.com/upload/attachment/0119/8163/2cb926d1-5a23-319b-9426-d46c6707a22c.jpg[/img]
[b]伪元素种类[/b]
[img]http://dl2.iteye.com/upload/attachment/0119/8165/b380aca2-ce1e-3a8e-b897-af4e1f6ae9d8.jpg[/img]
伪类就是一个你能通过为一个元素加入一个类就可以解决的
如:
:first-child
伪元素就是你要通过定义一个元素的方式才可以进行完成的(增加一个类是不能够完成的)
如:
:first-letter
[b]行高[/b]
置行间的距离
属性会影响行框的布局。在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。
[b]外部样式表[/b]
当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，
你就可以通过更改一个文件来改变整个站点的外观。
[b]内部样式表[/b]
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过
<style> 标签定义内部样式表。
[b]内联样式[/b]
当特殊的样式需要应用到个别元素时，就可以使用内联样式。
[b]样式的优先级[/b]
（外部样式）External style sheet <（内部样式）Internal style sheet <（内联样式）Inline style
[b]CSS 简介[/b]
CSS 指层叠样式表 (Cascading Style Sheets)
[b]CSS 语法[/b]
selector {declaration1; declaration2; ... declarationN }
h1 {color:red; font-size:14px;}以分号结束
CSS 对大小写不敏感。不过存在一个例外：如果涉及到与 HTML 文档一起工作的话，class 和 id 名称对大小写是敏感的。
[b]CSS 属性选择器[/b]
[title~=hello] { color:red; }[attribute] 用于选取带有指定属性的元素。
[attribute=value] 用于选取带有指定属性和值的元素。
[attribute~=value] 用于选取属性值中包含指定词汇的元素。
[attribute|=value] 用于选取带有以指定值开头的属性值的元素，该值必须是整个单词。
[attribute^=value] 匹配属性值以指定值开头的每个元素。
[attribute$=value] 匹配属性值以指定值结尾的每个元素。
[attribute*=value] 匹配属性值中包含指定值的每个元素。
[b]CSS 框模型[/b]
[img]http://dl2.iteye.com/upload/attachment/0119/8143/33ef7e59-8150-3f17-a7fb-d9bfd0d8a7c3.gif[/img]
元素框的最内部分是实际的内容
直接包围内容的是内边距
内边距呈现了元素的背景
内边距的边缘是边框
边框以外是外边距，外边距默认是透明的，因此不会遮挡其后的任何元素。
在 CSS 中，width 和 height 指的是内容区域的宽度和高度。
增加内边距、边框和外边距不会影响内容区域的尺寸，但是会增加元素框的总尺寸。
外边距合并指的是，当两个垂直外边距相遇时，它们将形成一个外边距。
合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者。
[b]CSS 浮动[/b]
浮动的框可以向左或向右移动，直到它的外边缘碰到包含框或另一个浮动框的边框为止。
由于浮动框不在文档的普通流中，所以文档的普通流中的块框表现得就像浮动框不存在一样。
[b]行框和清理[/b]
行框就是以块级标签定义的元素,内容可以是一个多行显示的内容
块级标签定义的元素在文档流中是独占一行的,就是说如果内容不足以占完一行(一块),后面的内容也不会占用剩下的空间
行内块级元素是会占用剩余空间进行内容显示的
浮动框旁边的行框被缩短，从而给浮动框留出空间，行框围绕浮动框。
[b]伪类和伪元素的区别[/b]
CSS 伪类用于向某些选择器添加特殊的效果。
CSS 伪元素用于将特殊的效果添加到某些选择器。
[b]伪类种类[/b]
[img]http://dl2.iteye.com/upload/attachment/0119/8163/2cb926d1-5a23-319b-9426-d46c6707a22c.jpg[/img]
[b]伪元素种类[/b]
[img]http://dl2.iteye.com/upload/attachment/0119/8165/b380aca2-ce1e-3a8e-b897-af4e1f6ae9d8.jpg[/img]
伪类就是一个你能通过为一个元素加入一个类就可以解决的
如:
:first-child
<p>
<i class="first-child">first</i>
<i>second</i>
</p>伪元素就是你要通过定义一个元素的方式才可以进行完成的(增加一个类是不能够完成的)
如:
:first-letter
<p><span class='first-letter'>I</span> am stephen lee.</p>[b]行高[/b]
置行间的距离
属性会影响行框的布局。在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。
[b]外部样式表[/b]
当样式需要被应用到很多页面的时候，外部样式表将是理想的选择。使用外部样式表，
你就可以通过更改一个文件来改变整个站点的外观。
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>[b]内部样式表[/b]
当单个文件需要特别样式时，就可以使用内部样式表。你可以在 head 部分通过
<style> 标签定义内部样式表。
<head>
<style type="text/css">
body {background-color: red}
p {margin-left: 20px}
</style>
</head>[b]内联样式[/b]
当特殊的样式需要应用到个别元素时，就可以使用内联样式。
<p style="color: red; margin-left: 20px">
This is a paragraph
</p>[b]样式的优先级[/b]
（外部样式）External style sheet <（内部样式）Internal style sheet <（内联样式）Inline style
2万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
