×

css的四种基本选择器类型

作者:andy0012020.06.22来源:Web前端之家浏览:5037评论:0
关键词:无缝滚动
微信公众号

微信公众号

CSS的选择器分为两大类:基本选择题和扩展选择器。其中有4种基本选择器,下面我们就来看一下css中四种基本选择器类型分别是什么?

基本选择器:

1、标签选择器:针对一类标签

2、ID选择器:针对某一个特定的标签使用

3、类选择器:针对你想要的所有标签使用

4、通用选择器(通配符):针对所有的标签都适用(不建议使用)

标签选择器:一个完整的HTML页面是有很多不同的标签组成,而标签选择器,则是决定哪些标签采用相应的CSS样式

style type="text/css">
p{
font-size:40px;
}</style>
<body>
<p>标签选择器</p>
</body>

id选择器:根据元素ID来选择元素,具有唯一性。前面以”#”号来标志。

<head>
<title>Document</title>
<style type="text/css">
#good
{
border:3px dashed green;
}
</style>
</head>
<body>
<h2 id="good">id选择器</h2>
</body>

类别选择器:类选择器根据类名来选择。和id非常相似,任何的标签都可以携带id属性和class属性。但是id属性只能被某一特定标签引用一次。

<style type="text/css">
.xl{
color: green;
}
.xd{
font-size: 40px;
}
</style>

<p class="xl xd">段落</p>
<p class="xl">段落</p>
<p class="xd">段落</p>

通配符*:匹配所有标签不建议使用。

<style type="text/css">
/*定义通用选择器*,希望所有标签的颜色是绿色字符大小40磅*/{
color: green;
font-size: 40px;
}
</style>

温馨提示:本文作者系 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
https://www.jiangweishan.com/article/html20200622a1.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

  • Web前端之家

    是的,等其他人验证没问题再装吧,总会有第一个吃螃蟹的人,哈哈!!...

  • a235

    Windows11现在还不敢装吧,貌似需要等待很多软件测试,不然装了,就怕不兼容。...

  • Web前端之家

    GoogleAdSense可以的,可以加群主,帮你搞定这事情~~...

  • s121

    GoogleAdSense好弄吗,想弄一个账号。...

  • s121

    不错,正好用到,收藏了!...

  • 访客

    什么机翻...

  • Web前端之家

    只是更轻便,还是有些差距的呢,小项目可以玩玩。...

  • ja124

    这个跟vue和react比,好些吗?...

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright © 2021 Web前端之家(www.jiangweishan.com) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.6.8 Valyria