您的位置：首页 > Web前端 > CSS

CSS中的几种选择器

2016-06-24 21:30 260 查看

1.标记选择器

p{

color:bule;

font-size:18px;

}

2.类选择器

<style type="text/css"

.one{

color:red;

}

.two{

font-size:20px;

}

</style>

<body>

<p class="one">应用第一种Class选择样式</p>

<p class="two">应用第二种Class选择样式</p>

</body>

3.id选择器

<style type="text/css"

#one{

color:red;

}

#two{

font-size:20px;

}

</style>

<body>

<p id="one">应用第一种Class选择样式</p>

<p id="two">应用第二种Class选择样式</p>

</body>

4.伪类选择器
：link (未访问的链接)

：visit（已访问的链接）

：hover(鼠标悬停状态)

：active（获得焦点的状态，即鼠标点下还未释放时的状态）

5.选择器的组合

1.交集选择器：

<style type="text'/css"

p{color:blue;}

.special{color:green;}

p.special{color:red;}

</style>

<body>

<p class="special">指定了special类别的段落文本</p>

</body>

2.并集选择器

h1,h2,h3,p{

font-size:12px;

color:purple;

}

3.后代选择器(不一定是直接子类，只要是子类都可以被选择)

a b{

color:blue;

}

4.子选择器（只有直接选择器才能被选择）

body>p{

color;green;

}

5.相邻选择器(相邻选择器将选中紧跟在它后面的一个兄弟元素，这两个元素必须有共同的父元素)

h2+p{

color:red;}

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航