css样式表应该分为三大类:
1.内部样式----内联样式
使用的是style标签
/* 样式 */
把页面的公共样式(不多的情况下)写在style标签中
2.行内样式
直接写在标签上的style属性中
通常是后台程序员进行修改页面的时候使用
3.外部样式
新建一个css文件,然后和html页面关联起来
a) 使用标签关联
b) 使用指令关联
/* 在style标签中 */
@import url("css文件路径")
做项目最常用的是外部样式,link标签。
css里大于号表示css3特有的子元素选择器;子元素选择器只能选择作为某元素子元素的元素;如果你不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,就可以使用子元素选择器
css指的是层叠样式表(Cascading Style Sheets),它是一种用来表现html或XML等文件样式的计算机语言,是用来表示html样式的一种编程语言,是可以做到网页和内容进行分离的一种样式语言。css中大于符号
css中大于符号(“>”)代表的是css3特有的子元素选择器(element>element )。子元素选择器(Child selectors)只能选择作为某元素子元素的元素。
如果你不希望选择任意的后代元素,而是希望缩小范围,只选择某个元素的子元素,请使用子元素选择器(Child selector)。
css选择器优先级核心:每个选择器本身有优先级,作用范围越具体优先级越高。
CSS优先级从高到低分别是:
1.在属性后面使用 !important 会覆盖页面内任何位置定义的元素样式。
2.作为style属性写在元素标签上的内联样式
3.id选择器
4.类选择器
5.伪类选择器
6.属性选择器
7.标签选择器
8.通配符选择器
9.浏览器选择器
当CSS样式的规则由多个选择器组成时,id选择器的权值为1000,class选择器为100,标签选择器为10,按权值求和的记过高低决定哪个优先。当两个css规则的权值相同时,谁更具体用谁,也就是权值高的选择器作用的越具体优先级越高。当两个选择器规则和权值都是一样,后面样式会覆盖前面的!
一、CSS选择器有哪些
CSS中的选择器很多,比如:ID选择器,类选择器,通配符选择器,伪类选择器等等,接下来主要介绍常用的几个。
1.标签选择器
语法:标签名{},eg:h1{}//为所有的h1元素设置样式。
2.ID选择器
语法:#id名{}//id值唯一不能重复,eg:#top{}//为id为top的元素设置样式。
3.类选择器
语法:.class{},eg:.box{}//为所有的class值为box的元素设置样式。
4.组选择器
语法:选择器1,选择器2,选择器N{},eg:#box1,.box2,p{}//为id为box1,class为box2和p的元素共同设置样式。
5、通配符选择器
语法:*{},eg:*{font-size:16px}//将整个页面字体大小设为16px。
6.后代选择器
语法:选择器1选择器2{},eg:p.aa{}//选中指定祖先元素p的指定后代.aa。
7.子元素选择器
语法:父元素>子元素{},eg:p>.box{}//选中父元素p的指定子元素.box。注意与后代元素选择器的区别
8.伪类选择器
伪类可以用来表示一些特殊的状态,如:
:link-未访问过的超链接。
:visited-已访问过的超链接。
:hover-鼠标经过的元素。
:active-正在点击的元素。
eg:a:hover{color:red}//鼠标经过a标签时,颜色变为红色。
二、CSS选择器的优先级顺序
当同一属性的不同值都作用到了同一个元素时,如果定义的属性之间有冲突,那么应该用谁的值的,这个时候就涉及到CSS的优先级顺序了。
1.在属性后面使用!important会覆盖页面内任何位置定义的元素样式。
2.作为style属性写在元素内的内部样式
3.id选择器
4.类选择器
5.标签选择器
6.通配符选择器
7.浏览器自定义或继承的
Copyright © 广州京杭网络科技有限公司 2005-2024 版权所有 粤ICP备16019765号
广州京杭网络科技有限公司 版权所有