首页 > 代码库 > CSS学习(1)选择器
CSS学习(1)选择器
使用CSS
1,CSS是层叠样式表(Cascading Style Sheet),由选择器和声明块两部分构成。如下前部分h1是选择器,花括号包围的块是声明块。
h1 { color: red;}
2,CSS使用主要分为外部样式表,嵌入样式表,和内联样式表。
/*外部样式表*/<link rel="stylesheet" href="http://www.mamicode.com/base.css">/*嵌入样式表*/<style> h1 { color: red; }</style>/*内联样式表*/<h1 style="color: red">内联样式表</h1>
3,选择器用来确定样式表要应用到哪些元素中。可用的选择器类别有五种:元素名称、类别、伪类、属性、ID
(1)在优先级上,ID的优先级是最高的,元素名称最低,类别和属性是一样的。
(2)选择器可以混合使用。混合后的选择器优先级从右边往左开始计算。比如 h1.very要比 .very h1的优先级高,所以同时满足两者的元素会优先使用h1.very的样式。如果优先级相同则使用后出现的样式
(3)混合使用选择器:
a,元素名称:与同类选择器组合,以空格隔开表示父子元素关系;以逗号隔开表示等同关系
b,类别用点号+类名
c,伪类使用冒号+伪类名
d,属性使用[name="value"]属性值不填时[name]表示不限制属性值,可用的匹配模式有 =, ~=, |=, *=, ^=, $=
e,ID用#id
h1,h2 { } /*h1,h2元素*/h1 h2 { } /*h1的所有h2子元素*/h1 > h2 { } /*h1的直接h2子元素*/h1 + h2 { } /*h1后面的相邻的同父元素的h2元素 */h1 ~ h2 { } /*h1后面的同父元素h2元素*/h1.very h2[lang|="zh"]:first-letter { }
CSS学习(1)选择器
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。