css作为网页的肉体,承载着我们浏览的方方面面,它使我们的网页有了更深层次的拓展,虽然它有着庞大的样式支持,但只要理解了基本内容的含义和原理,就能较好的掌握。
理解css
- css工作原理的关键:每个HTML元素的周围都有一个看不见的盒子。
- 在css中,规则由你来创造,由你来控制盒子及盒子里的内容的呈现方式。
使用css
- 使用外部css。(另写一个页面,通过link标签来建立联系)
- 使用内部css。(通常head元素中填写)
- 尽量使用外部css。(将页面的内容和呈现分离,使得页面简洁。 不同的页面可以使用相同的css属性 便于修改)
css选择器
- 通用选择器 * { } 应用于页面的所有元素
- 类型选择器 div 应用于所有div元素
- 类选择器 .list 应用于class ="div" 的所有元素
- ID选择器 #ICY 应用于id 特性为ICY的元素(class 为类,ID为单一独立个体)
- 子元素选择器 li>a { } 应用父元素为<li>的<a>元素
- 后代选择器 li a { } 应用于前辈为<li>的<a>元素
- 相邻兄弟选择器 hi+p {} 应用于<h1>和第一个<p>之间的元素
- 普通兄弟选择器 h1~p { } 应用于所有和h1兄弟的p之间的所有元素
规则的优先级
- 从上向下一次执行所设置的类型( !important 使元素的优先级变为最高)
- 具体性原则( div 比 * 具体 )
css就是一个无形的盒子,css规则通常出现在单独的文档中.