详解CSS中的伪元素

news/2024/10/4 20:00:49/

4.3 伪元素

可以把样式应用到文档树中根本不存在的元素上。

::first-line 文本中的第一行

::first-letter 文本中的第一个字母

::after 元素之后添加

::before 元素之前

代码:

<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title></title><style>p::first-line {background-color: red;}p::first-letter {color: blue;font-weight: 600;}h1::before {content: "我是h1前面的添加的内容";color: chocolate;}p::after {content: "我是P后面的内容";color: brown;}</style>
</head>
<body><h1>|WWF's Mission Statement</h1><p>To stop the degradation of theplanet's natural environmentand to build a future in whichhumans live in harmony with nature,by; conserving the world's biological diversity, ensuring that the use of renewable natural resources issustainable, and promoting the reduction of pollution and wasteful consumption.|</p>
</body>
</html>

小结:UI元素状态,:selection冷门生僻,不学习。


http://www.ppmy.cn/news/1533878.html

相关文章

国庆刷题(day1)

C语言刷题&#xff1a; C刷题&#xff1a; 全对实在是太难了&#xff0c;我尽力了。。

基于SpringBoot的诗词学习网站的设计与实现

目录 毕设制作流程功能和技术介绍系统实现截图开发核心技术介绍&#xff1a;使用说明开发步骤编译运行代码执行流程核心代码部分展示可行性分析软件测试详细视频演示源码获取 毕设制作流程 &#xff08;1&#xff09;与指导老师确定系统主要功能&#xff1b; &#xff08;2&am…

【C++篇】启航——初识C++(上篇)

下篇&#xff1a;【C篇】启航——初识C&#xff08;下篇&#xff09; 目录 引言 一、C的起源和发展史 1.起源 2.C版本更新 二、C在⼯作领域中的应⽤ 三、C入门建议 1.参考文档 2.推荐书籍 四、C的第一个程序 1.C语言写法 2.C写法 五、命名空间 1.为什么要有命名空…

Android中的页面跳转机制

在Android应用开发中&#xff0c;页面跳转是构建用户界面和导航流程的核心功能之一。它允许用户在不同的视图或活动&#xff08;Activity&#xff09;之间无缝切换&#xff0c;以执行不同的任务或查看不同的信息。本文将详细介绍Android中实现页面跳转的基本方式、最佳实践以及…

golang学习笔记19-面向对象(一):面向对象的引入

注&#xff1a;本人已有C&#xff0c;C,Python基础&#xff0c;只写本人认为的重点。 这节开始就是面向对象的内容了&#xff0c;为方便复用结构体等类型&#xff0c;本人定义了一个utils包&#xff0c;用于定义这些类型&#xff0c;之后的文章也会用到&#xff0c;希望读者注意…

分布式选举 - Paxos、Zab 和 Raft 选举协议的逐步优化与对比分析

在分布式系统中&#xff0c;选举协议的设计是确保一致性与高可用性的核心。Paxos、Zab 和 Raft 作为分布式一致性协议的代表&#xff0c;展示了协议优化的逐步过程。从 Paxos 到 Zab&#xff0c;再到 Raft&#xff0c;每个协议都对前者的复杂性和效率进行了改进。本文将通过对比…

docker kibana 连接es

server.name: kibana server.host: “0” #容器中配置&#xff0c;去掉http://127.0.0.1:9200 elasticsearch.hosts: [“http://host.docker.internal:9200”] #设置访问用户 elasticsearch.username: “elastic” #设置访问密码 elasticsearch.password: “elastic” #设置中文…

TCP/UDP初识

TCP是面向连接的、可靠的、基于字节流的传输层协议。 面向连接&#xff1a;一定是一对一连接&#xff0c;不能像 UDP 协议可以一个主机同时向多个主机发送消息 可靠的&#xff1a;无论的网络链路中出现了怎样的链路变化&#xff0c;TCP 都可以保证一个报文一定能够到达接收端…