CSS选择器 快速入门

embedded/2024/10/5 18:20:43/

CSS选择器的作用 

        CSS 选择器用于选择你想要的元素的样式的模式。可以用于调节字体,字体宽度大小颜色。例如,可以选择所有的 <p> 标签,并改变它们的颜色;或者选择具有特定类名的元素,应用特定的边距和填充等等。

常见的CSS选择器类型

元素选择器

直接选择指定类型的 HTML 元素。

css">p {color: red;
}

假设 HTML 页面中有多个 <p> 标签,这条 CSS 规则会让所有的 <p> 标签的文字颜色变为红色。

类选择器

选择具有指定类名的所有元素。

类选择器以 . 开头,后面跟着类别名称。

css">.example {background-color: yellow;
}

假设 HTML 页面中有几个元素都设置了类名 example,这条 CSS 规则会使这些元素的背景色变成黄色。

ID选择器

选择具有指定 ID 的元素。

ID 选择器以 # 开头,后面跟着 ID 名称。

css">#uniqueId {font-size: 20px;
}

假设 HTML 页面中有一个元素设置了 id="uniqueId",这条 CSS 规则会使这个元素的字体大小变成 20px。

属性选择器

选择具有指定属性或属性值的元素。

css">input[type="text"] {border: 1px solid black;
}

假设 HTML 页面中有几个 <input> 元素,其中一些类型为 text,这条 CSS 规则会使这些输入框的边框变为黑色实线。

后代选择器

通过指定元素的后代关系选择 HTML 元素。

后代选择器使用空格分隔元素名称。

css">div p {font-weight: bold;
}

假设 HTML 页面中有一些 <p> 标签位于 <div> 标签内部,这条 CSS 规则会使这些 <p> 标签的文字加粗。

伪类选择器

css">a:hover {color: blue;
}

假设 HTML 页面中有多个 <a> 链接,当鼠标悬停在这些链接上时,链接的颜色会变为蓝色。


http://www.ppmy.cn/embedded/123498.html

相关文章

使用C语言获取iostat中的await值的方法和方案

使用C语言获取iostat中的await值的方法和方案 1. 准备工作2. 调用iostat命令并获取输出3. 解析iostat输出4. 完整实现和错误处理5. 注意事项在Linux系统中,iostat命令是sysstat软件包的一部分,用于监控系统的CPU、网卡、tty设备、磁盘、CD-ROM等设备的活动情况和负载信息。其…

我为什么决定关闭ChatGPT的记忆功能?

你好&#xff0c;我是三桥君 几个月前&#xff0c;ChatGPT宣布即将推出一项名为“记忆功能”的新特性&#xff0c;英文名叫memory。 这个功能听起来相当吸引人&#xff0c;宣传口号是让GPT更加了解用户&#xff0c;仿佛是要为我们每个人量身打造一个专属的AI助手。 在记忆功…

数据服务-存储服务(NFS)

1.概述 存储: 用于存放用户上传的内容(数据),一般应用在网站集群中 如果不使用存储,用户上传的数据就直接存放在网站服务器上了,用户下次访问就可能找不到 如果使用存储,用户上传的内容存放在存储上面,用户访问就会访问存储. 位置: 网站后排. 2. 存储分类 分类说明硬件存储硬件…

网络编程套接字TCP

前集回顾 上一篇博客中我们写了一个UDP的echo server&#xff0c;是一个回显服务器&#xff1a;请求是啥&#xff0c;响应就是啥 一个正常的服务器&#xff0c;要做三个事情&#xff1a; 读取请求并解析根据请求&#xff0c;计算响应把响应写回到客户端 DatagramPacket res…

vue3+vite@4+ts+elementplus创建项目详解

1、第一步创建项目cnpm init vite4 2、设置vue3.2局域网可访问配置&#xff1a; 找到项目路径下的package.json目录下找到script对象下面添加一下代码&#xff1a; "serve": "vite --host 0.0.0.0" 启动项目命令不在是dev而是&#xff1a;cnpm run serve 3…

第十章---关闭同步流及注意事项及详细分析cin.ignore();

1.关闭同步流及注意事项 1.关闭同步流&#xff1a;ios::sync_with_stdio(0), cin.tie(0), cout.tie(0); ios::sync_with_stdio(0); 这条语句的目的是告诉C的IO库&#xff0c;不要将C的iostream对象&#xff08;如cin, cout, cerr等&#xff09;与C的stdio库&#xff08;如st…

dijstra算法——单元最短路径算法

Dijkstra算法 用来计算从一个点到其他所有点的最短路径的算法&#xff0c;是一种单源最短路径算法。也就是说&#xff0c;只能计算起点只有一个的情况。Dijkstra的时间复杂度是O(n^2)&#xff0c;它不能处理存在负边权的情况。 算法描述&#xff1a; 设起点为s&#xff0c;d…

初识TCP/IP协议

回顾上文 来回顾一下TCP协议的特性&#xff0c;有一道比较经典的题&#xff1a;如何使用UDP实现可靠传输&#xff0c;通过应用程序的代码&#xff0c;完成可靠传输的过程&#xff1f; 原则&#xff0c;TCO有啥就吹啥&#xff0c;引入滑动窗口&#xff0c;引入流量控制&#x…