CSS样式
CSS简介
层叠样式表是一种用来表现HTML或XML等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。
CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。
CSS优点
解决创建文档内容清晰地独立于文档表现层的站点变得越来越困难的问题;由于允许同时控制多重页面的样式和布局,CSS极大地提高了工作效率并且多重样式还可以层叠为一个在同一个 HTML 文档内部引用多个外部样式表。
CSS基础语法
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。
selector {declaration1; declaration2; ... declarationN }
选择器通常是你需要改变样式的HTML元素
每条声明由一个属性和一个值组成。
属性是你希望设置的样式属性。每个属性有一个值。属性和值被冒号分开
selector {property: value}
值还有不同的写法,比如用十六进制或者CSS的缩写形式。
如果你想要定义多个声明,则需要用分号将每个声明分开。
比如:
p {text-align:center; color:black;}
CSS高级语法
选择器的分组
如果要对选择器进行分组,可以用逗号将所需要的分组的选择器分开,并且分组的选择器也可以分享相同的声明。
比如:
h1,h2,h3,h4,h5,h6 {
color: green;
}
这样分组后,所有的标题元素都是绿色的。
继承及其问题
CSS的子元素可以从父元素那里继承属性,但是它并不是总是这样去工作。
比如:
body {
font-family: Verdana, sans-serif;
}
通过CSS继承,子元素将继承最高级元素所拥有的属性。不需要另外的规则,所有 body 的子元素都应该显示 Verdana 字体,子元素的子元素也一样。并且在大部分的现代浏览器中,也确实是这样的。
但是还是有的不支持继承的,比如Netscape4就不支持。它不仅忽略继承,而且也忽略应用于 body 元素的规则。IE/Windows 直到 IE6 还存在相关的问题,在表格内的字体样式会被忽略。
如果要解决这种问题,我们就需要用到“Be King to Netscape4”的冗余法则来处理旧式浏览器无法理解继承的问题。
CSS选择器的分类
CSS选择器分为派生选择器,id选择器,类选择器以及属性选择器。
派生选择器:在 CSS1 中,通过这种方式来应用规则的选择器被称为上下文选择器 ,这是由于它们依赖于上下文关系来应用或者避免某项规则。在 CSS2 中,它们称为派生选择器。
id选择器:id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式。并且id 选择器以 "#" 来定义。
类选择器:在 CSS 中,类选择器以一个点号显示。
属性选择器:对带有指定属性的 HTML 元素设置样式。可以为拥有指定属性的 HTML 元素设置样式,而不仅限于 class 和 id 属性。
浙公网安备 33010602011771号