欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
您的位置:DIVCSS5首页 > CSS3 >

Css3属性选择器和伪类选择器

属性选择器:

 [attr~="value"]   单词             单词空格单词   单词必须value有效

[attr|="value"]   value打头  或者  value-单词

注意:

属性选择 都是用则很难规则表达式来判别 选择元素,效率要高一些

伪类选择器:

before

after

:lang(val)   val/val-单词

nth-child(n) n1开始算起  odd基数 even偶数

:nth-of-type(n) 选择器匹配属于父元素的特定类型的第 N 个子元素的每个元素.

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>无标题文档</title>

<link href="css/index.css" rel="stylesheet" type="text/css" />

</head>

<body>

<!--

<p lang="en">aaaaaaa</p>

<p lang="en-demo">aaaaaaa</p>

<p lang="entest">aaaaaaa</p>

--->

<div>

       <p>aaa</p>

       <p>aaa</p>

       <p>aaa</p>

       <p>aaa</p>

</div>

</body>

</html>

Css部分:

@charset "utf-8";

/* CSS Document */

/*

p:before{

       content:"ccc"; 

}

 

p:lang(en){

       border:1px solid #ff0000;  

}

p:nth-child(even){

       background:#F00; 

}

*/

p:nth-of-type(3){  /* p标记的父元素 下的 第3p元素*/

       background:#F00; 

}

 

 

 

 

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/css3-style/c14316.shtml

我要分享到:
上一篇: Css3设置边框属性
下一篇:Css3动画属性

必备CSS教程 Essential CSS Tutorials

必备HTML基础教程 Essential HTML Tutorials

如对文章有任何疑问请提交到DIV CSS论坛,或有任何网页制作CSS问题立即到CSS论坛发贴求解 或 直接DIVCSS5网页顶部搜索遇到DIVCSS疑问。
CSS教程文章修订日期:2016-11-13 16:43 原创:DIVCSS5
本文www.divcss5.com DIVCSS5版权所有。