您现在的位置是:网站首页> 编程资料编程资料
CSS 选择器浅谈_CSS教程_CSS_网页制作_
2021-09-08
863人已围观
简介 属性选择器 CSS3 标准还有很多非常实用的特性,但IE 7 依然不支持
A 标签HTML 选择器
body{
padding:0px; margin:0px; background-color:#ffdee0;
}
B 类别CLASS 选择器
......
C 专用ID 选择器
......
D 选择器组合筛选
......
E 选择器集体声明 (选择器之间使用逗号)
......
F 选择器的嵌套 (选择器之间使用空格)
......
G 子选择器:用来选择一个父元素直接的子元素,不包括子元素的子元素。(选择器之间使用大于号)
......
使用“子选择器”示例
不使用“子选择器”示例
注意:
1、子选择器的设置在IE 6 下使用无效(所以本人不推荐经常使用);
2、如果嵌套的父子标签是同一种标签,子选择器的设置也将使用无效。如:
......
注意:
1、属性选择器的设置在IE 6 下使用无效(在IE 7 下使用有效);
2、属性选择器 CSS3 标准还有很多非常实用的特性,但IE 7 依然不支持;
复制代码
代码如下:body{
padding:0px; margin:0px; background-color:#ffdee0;
}
B 类别CLASS 选择器
复制代码
代码如下:......
刘德华
张学友
何炅
汪涵
C 专用ID 选择器
复制代码
代码如下:......
刘德华
张学友
何炅
汪涵
D 选择器组合筛选
复制代码
代码如下:......
刘德华
张学友
何炅
汪涵
E 选择器集体声明 (选择器之间使用逗号)
复制代码
代码如下:......
刘德华
张学友
F 选择器的嵌套 (选择器之间使用空格)
复制代码
代码如下:......
刘德华
郭富城
张学友
G 子选择器:用来选择一个父元素直接的子元素,不包括子元素的子元素。(选择器之间使用大于号)
复制代码
代码如下:......
使用“子选择器”示例
aaaaa
bbbbb
不使用“子选择器”示例
aaaaa
bbbbb
注意:
1、子选择器的设置在IE 6 下使用无效(所以本人不推荐经常使用);
2、如果嵌套的父子标签是同一种标签,子选择器的设置也将使用无效。如:
父子标签是同一种标签
;
H 属性选择器:针对HTML 标签中的属性进行选择的。
复制代码
代码如下:......
无title属性的段落标签
将有title属性的p标签设置为红色
将title属性值为"t2"的p标签设置为蓝色
注意:
1、属性选择器的设置在IE 6 下使用无效(在IE 7 下使用有效);
2、属性选择器 CSS3 标准还有很多非常实用的特性,但IE 7 依然不支持;
相关内容
- CSS学习之一 CSS样式的引入 _CSS教程_CSS_网页制作_
- 纯CSS实现的小三角_CSS教程_CSS_网页制作_
- 区别各种IE浏览器的css写法_CSS教程_CSS_网页制作_
- 同级情况下CSS的优先级探讨_CSS教程_CSS_网页制作_
- CSS强制按比例缩小图片 _CSS教程_CSS_网页制作_
- 浮动层自动适应高度的解决方法_CSS教程_CSS_网页制作_
- CSS伪类_CSS教程_CSS_网页制作_
- IE6对多个CSS样式的解析 _CSS教程_CSS_网页制作_
- web标准教程,帮你走进web标准设计的世界 第三讲(html终结篇)_Web标准教程_CSS_网页制作_
- web标准教程,帮你走进web标准设计的世界 第二讲_Web标准教程_CSS_网页制作_