搜索到
3
篇与
的结果
-
CSS中的选择器 CSS中的选择器CSS选择器包括4大类： 标签选择器、id选择器、class选择器、特殊选择器； 常用的选择器有十种左右：标签选择器类选择器ID选择器伪类选择器群组选择器（集合选择器）通配符（*）包含选择器 （后代选择器）伪元素选择器属性选择器1、标签选择器：类型选择符是根据html语言中的标记来直接定义语法：标签名称 {属性：属性值；} 实例： div { width: 30px}所有的页面元素都可以作为选择符;用法：（1）如果想改变某个元素的默认样式时，可以使用标记选择符；（2）当统一文档某个元素的显示效果时，可以使用标记选择符；2、类选择器（ class选择器）：类选择器使用必须要通过引用才能生效 语法：.class名称{属性：属性值;}用法：class选择符更适合定义一类样式；(1)当我们使用类选择符时，应先为每个元素定义一个类名，(2)类选择符的语法格式： 如： .top{属性:属性值;}3、ID选择器：语法： <div id=“id名”</div例如： #id名{属性：属性值;}说明：（1）可以给每个元素使用id选择符，但id是元素的唯一标识符，不可出现重复的id名； 如：<div id="top"></div>（2）id选择符的语法格式是“#”加上自定义的id名 如：#box{width:300px; height:300px;}(3) 起名时要取英文名，不能用关键字：(所有的标记和属性都是关键字) 如：head标记(4)一个id名称只能在文档中出现一次，因为id是唯一的 (5) 最大的用处：创建网页的外围结构。4、通配符：*语法：*{属性：属性值;} 说明：通配选择符的写法是“*”，其含义就是所有元素；表示该样式适用所有网页元素；用法：常用来重置样式。5、伪类选择器：a:link {color: #FF0000;} / 未访问的链接 /a:visited {color: #00FF00;} / 已访问的链接 /a:hover {color: #FF00FF;} / 鼠标移动到链接上 /a:active {color: #0000FF;} / 选定的链接 /注意： 按照以上顺序编写都可正常显示样式，否则有些状态不能正常显示6、群组选择器（集合选择器）语法：选择器1，……，选择器5 {属性：属性值;}说明：当有多个选择器应用相同的样式时，可以将每个选择器用“，”分隔的方式，合并为一组。 实例：.div, #div, p{width:100px;}7、包含选择器(后代选择器)语法：选择器1 选择器2{属性：属性值;}说明：选择器1和选择器2用空格隔开，含义就是选择器1中包含的所有选择器2实例： div ul li { height:200px; }8、CSS选择器的权重当不同选择符的样式设置有冲突的时候，高权重选择符的样式会覆盖低权重选择符的样式。相同权重的选择符，样式遵循就近原则：选择符后定义样式优先被使用。css中用四位数字表示权重，权重的表达方式如：0，0，0，0；权重规则：id选择符的权重为 0100类型选择符的权重为0001class选择符的权重为0010群组选择符权重为他本身包含选择符的权重：为包含选择符的权重之和内联样式的权重为1000继承样式的权重为0000 -
CSS语法以及CSS样式表 CSS基础语法说明：CSS选择器（选择符）选择器表示要定义样式的对象，可以是元素本身，也可以是一类元素或者制定名称的元素.css的语法由两部分组成：选择符和声明，其中声明又包括属性和属性值属性和属性值用冒号链接，属性和属性之间用分号结束，冒号和分号必须是英文模式下的CSS的样式表1、内联样式（行间样式，行内样式）创建语法： 2、内部样式表（嵌套到页面中）创建语法：注：使用style标记创建样式时，最好将该标记写在head与/head之间;3、引用外部样式表文件(1) 引用写法：说明：使用link元素导入外部样式表时，需将该元素写在文档头部，即head与/head之间。rel：用于定义文档关联，表示关联样式表；type：定义文档类型；(2)、导入写法说明：@和import之间没有空格 url和小括号之间也没有空格；括号内部加引号，必须结尾以分号结束；扩展知识：*link和import导入外部样式的区别： 差别1：老祖宗的差别： link属于XHTML标签，而@import完全是CSS提供的一种方式。 link标签除了可以加载CSS外，还可以做很多其它的事情，比如定义rel连接属性等，@import就只能加载CSS 差别2：加载顺序的差别： 当一个页面被加载的时候（就是被浏览者浏览的时候），link引用的CSS会同时被加载，而@import引用的CSS 会等到页面全部被下载完再被加载。所以有时候浏览@import加载CSS的页面时开始会没有样式。 差别3： 兼容性的差别： @import是CSS2.1提出的，所以老的浏览器不支持，@import只在IE5以上的才能识别，而link标签无此问题。 差别4：使用dom控制样式时的差别： 当使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的.4、css样式表的优先级：内联样式表的优先级别最高内部样式表与外部样式表的优先级和书写的顺序有关，后书写的优先级别高。
-
