css选择器是什么？

要使用css对HTML页面中的元素实现一对一，一对多或者多对一的控制，这就需要用到CSS选择器。

HTML页面中的元素就是通过CSS选择器进行控制的。

CSS选择器：就是指定CSS要作用的标签，那个标签的名称就是选择器。意为：选择哪个容器。

CSS的选择器分为两大类：基本选择题和扩展选择器。

基本选择器：
1.标签选择器：针对一类标签
2.ID选择器：针对某一个特定的标签使用
3.类选择器：针对你想要的所有标签使用
4.通用选择器（通配符）：针对所有的标签都适用（不建议使用）

1.标签选择器：一个完整的HTML页面是有很多不同的标签组成，而标签选择器，则是决定哪些标签采用相应的CSS样式，(在大环境中你可能出于不同的位置，但是不管怎么样，你总是穿着同一套衣服，这件衣服就是由标签选择器事先给你限定好的，不管走到哪里都是这身衣服)

如下所示：

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

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

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

3.类别选择器：类选择器根据类名来选择。和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>

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

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

css四种基本选择器的更多相关文章

  1. css样式表中四种属性选择器

    学习此连接的总结http://developer.51cto.com/art/201009/226158.htmcss样式表中四种属性选择器1> 简易属性 tag[class]{ font-we ...

  2. 前端基础----CSS语法、CSS四种引入方式、CSS选择器、CSS属性操作

    一.CSS语法 CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明. 例如: h1 {color:red; font-size:14px;} 二.CSS四种引入方式 1,行内式 行内式是在标 ...

  3. CSS 四种引入样式表优缺点分析

    CSS 四种引入样式表 CSS 有四种方式引入样式表,如下: 外部样式表 内部样式表 行内样式表 导入样式表 外部样式表优缺点 优点 实现了结构与表现的代码完全分离 方便复用及维护 因为分离到各自独立 ...

  4. css四种选择器总结

    css 在网页开发中扮演着重要的角色,被誉为网页开发的三剑客,如果说html是人的外在器官部分,那css无疑是各个器官组成在一起然后表现出来,css又称样式重叠在网页排版布局中的地位举足轻重.   做 ...

  5. CSS 四种样式表 六种规则选择器 五种常用样式属性

    新的html程序要在VS中编写了,在vs中安装ASP.NET和Web开发,并用ASP.NET Web 应用程序(.NETFramework)创建一个网页程序.添加一个html页 后面的代码都是在htm ...

  6. CSS四种定位及应用

    定位(position) 如果,说浮动, 关键在一个 “浮” 字上面, 那么 我们的定位,关键在于一个 “位” 上. PS: 定位是我们CSS算是数一数二难点的了,但是,你务必要学好它,我们CSS离不 ...

  7. CSS的四种基本选择器和四种高级选择器

    做个快乐的搬运工:https://blog.csdn.net/DYD850804/article/details/80997251

  8. css四种定位

    概述:元素定位属性主要包括的模式和边偏移两部分,也就是说以后定位要和边偏移量搭配使用.边偏移加定位定位模式才能构成一个完整的定义方式. 偏移量说明: 边偏移属性 描述 top: 顶端偏移,定义元素相对 ...

  9. Css四种样式

    1. 2 3 4 5 6.

随机推荐

  1. redis分布式锁-自动超时锁（在用）

    1.加锁代码结构 2.解锁代码结构 3.java实例 4.测试类 5.测试日志 加锁代码结构 def acquire_lock_with_timeout(conn,lockname,acquire_t ...

  2. RecyclerView实现Gallery画廊效果

    使用RecyclerView实现一个画廊效果,主要是使用support库中最新加入的PagerSnapHelper类,通过计算滑动偏移来计算scale的值. 基本实现 首先需要为RecyclerVie ...

  3. 阿里云安装RocketMQ

    说明: 我的阿里云是centos 6.9 jdk 1.8.0_192-b12(安装教程参照:https://www.cnblogs.com/kingsonfu/p/9801556.html) mave ...

  4. Axure实现banner功能

    1.添加一个动态面板,添加上一张.下一张及当前banner对应的序号圆圈,如图所示: 当添加好元素后,实现自动轮播:点击[轮播图面板]页面:选中动态面板:右边添加事件编辑栏——属性——载入时——添加动 ...

  5. springboot 使用freemarker自定义标签

    1.pom依赖引入 <dependencies> <dependency> <groupId>org.springframework.boot</groupI ...

  6. eclipse与hadoop集成，运行wordCount1

    搭好了hadoop集群之后,就该使用它了 第一步:下载hadoop eclipse的插件,将它放到eclipse\plugins的目录下,然后重启eclipse,点击windows->show ...

  7. node学习笔记(一)本地文件目录查看器

    Node.js 新闻 nw.js 前端开发桌面应用 内容 node.js实战 照例提供百度云链接,本来以为是实战系列的那本,但不是,不过这本也不错 链接:https://pan.baidu.com/s ...

  8. .net core 3.0 Signalr - 06 业务实现-业务分析

    ## 业务需求 1. 人-项目关系 一个人可以属于多个项目,一个项目可以有多个人加入,通知的时候,可以通知项目内的所有人,也可以通知部分人或者某个责任人. 2. 登录互斥 同一个人不允许登录两次(不同 ...

  9. 3D漫游的分类 3D Navigation Taxonomy

    在2001年CHI发表的论文中1,Tan等人提出了一种对3D漫游的分类方法. 当时关于3D漫游(3D Navigation)的研究主要分为两种:一种是发掘有关漫游的认知原则,一种是开发一些具体的漫游技 ...

  10. 【百度地图】如何去掉百度LOGO

    只需要一步就解决问题,在CSS里加入一段代码即可: .anchorBL{display:none;}