??????? 一般而言,所有的样式会根据以下的规则层叠与一个新的虚拟样式表中:1. 浏览器缺省设置 2.外部样式表 3.内部样式表(<head>标签内) 4.内联样式(元素内部)。优先级为4>3>2>1。
????????? 1、外部样式表??? <head>标签中添加<ling rel="stylesheet" type="text/css" href="***.css" />
????????? 2、内部样式表?? <head>标签中添加<style type="text/css">样式</style>
????????? 3、内联样式?????? 在相关元素中使用style属性
(3)CSS继承
??????? CSS的继承是指应用于某个元素的属性会被该元素的所有子元素继承。而THML中有如下<td class="code"></td>,CSS有如下规则:td {font-family: courier,courier-new,serif;} 或?td.code {font-family: courier-new,serif;} 。前一个表示对所有td应用样式font-family: courier,courier-new,serif?,而不是body设置的样式。后一条则表示对于包含code类的td,优先使用样式font-family: courier-new,serif,而不是对全部td设置的样式,更不是body设置的样式。所以,选择器更加特定于他所应用的元素。
(4)选择器? ? ? ? ? ??1、类型(元素)选择器:h1,td,p{}
????????? 2、id选择器:#id p {}??? id选择器常用于建立派生选择器,表明指定id的div等中的某些元素应用何种样式
?????????????????? .class p {}构建派生选择器,? td.classname {}? 包含类classname的td应用对应规则。
多类选择器: .class1 .class2 {} 只有同时包含两个累的元素才能匹配该规则,例如:
? ?<p class="class2 class1"></> 或者<p class="class2 class3 class1"></>
????????? 4、通配符选择器:* {} ?为所有元素添加属性
? ? ? ? ? ??5 、属性选择器:[title] {} 带有title属性的所有元素; [title=ss]{} title属性值为ss的所有元素
????????????? (举个栗子:input [type="text"] {}??? input[type="button"] {})而a[href] [title] {}则对同时有href和title属性的a元
素应用规则
? ? ? ? ? 6、后代选择器(依据元素位置的上下文关系定义):li strong {} li元素中的strong 元素将应用该样式
? 7、子元素选择器(与后代选择器先比,只能选择作为某元素直接子元素的元素):li > strong {}
? ? ? ? ??8、相邻兄弟选择器(对于有相同父元素的多个元素,匹配紧邻的后一个元素):li + strong {},将匹配与li紧邻
? ? ? ? ? ? ? ? 的兄弟元素strong