当前位置： 首页 > news >正文

详解CSS中的伪元素

news 2025/9/15 2:09:54

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冷门生僻，不学习。

相关文章：

详解CSS中的伪元素

4.3 伪元素 可以把样式应用到文档树中根本不存在的元素上。 ::first-line 文本中的第一行 ::first-letter 文本中的第一个字母 ::after 元素之后添加 ::before 元素之前 代码&#xff1a; <!DOCTYPE html> <html> <head><meta charset"utf-8&q…...

编程日记 2024/10/7 5:22:35

paper_template

paper_template Title 文章标题 Abstract 摘要 Keywords 关键词 Highlights Highlights / 创新点 Summary 写完笔记之后最后填&#xff0c;概述文章的内容&#xff0c;以后查阅笔记的时候先看这一段。 Backgrounds 描述当前研究背景 Research Objective 作者的研…...

编程日记 2024/10/7 5:21:34

【Bug】解决 Ubuntu 中 “error: Unable to Find Python3 Executable” 错误

解决 Ubuntu 中 “Unable to Find Python3 Executable” 错误 在 Ubuntu 系统上使用 Python 进行开发时&#xff0c;遇到找不到 python3 可执行文件的错误。 主要问题是无法正常打开终端&#xff08;原生与terminator&#xff09;&#xff0c;找不到python3&#xff0c;且无法…...

编程日记 2024/10/7 5:18:30

CUDA与TensorRT学习六：模型部署-CNN、模型部署-YOLOv8检测器、部署BEVFusion模型

文章目录 一、模型部署-CNN二、模型部署-YOLOv8检测器三、部署BEVFusion模型 一、模型部署-CNN 二、模型部署-YOLOv8检测器 三、部署BEVFusion模型...

编程日记 2024/10/7 5:17:28

防sql注入的网站登录系统设计与实现

课程名称 网络安全 大作业名称 防sql注入的网站登录系统设计与实现 姓名 学号 班级 大 作 业 要 求 结合mysql数据库设计一个web登录页面密码需密文存放&#xff08;可以采用hash方式&#xff0c;建议用sha1或md5加盐&#xff09;采用服务器端的验证码&#…...

编程日记 2024/10/7 5:14:25

如何快速切换电脑的ip地址

在当今的数字化时代&#xff0c;IP地址作为网络身份的重要标识&#xff0c;其重要性日益凸显。无论是出于保护个人隐私的需要&#xff0c;还是为了访问特定的网络服务等&#xff0c;快速切换电脑的IP地址已成为许多用户的迫切需求。本文将为你介绍几种实用的方法&#xff0c;帮…...

编程日记 2024/10/7 5:13:24

鸿蒙HarmonyOS之选择相册文件（照片/视频）方法

一、新建文件工具类FileUtil.ets 包含&#xff1a;选择照片方法、获取文件类型方法、去除后缀、获取后缀方法 import { BusinessError, request } from kit.BasicServicesKit; import photoAccessHelper from ohos.file.photoAccessHelper; import bundleManager from ohos.b…...

编程日记 2024/10/7 5:10:20

【QT Qucik】C++交互：接收QML信号

在本节课中&#xff0c;我们将深入探讨如何在C中接收QML发出的信号。我们将分为几个部分&#xff0c;详细说明信号的定义、发送及其在C中的接收。 理解信号和槽机制 Qt的信号与槽机制是一种用于对象之间通信的强大工具。信号是对象在特定事件发生时发送的通知&#xff0c;而槽…...

编程日记 2024/10/7 5:08:17

【C++】关键字+命名空间

大家好&#xff0c;我是苏貝&#xff0c;本篇博客带大家了解C的命名空间&#xff0c;如果你觉得我写的还不错的话&#xff0c;可以给我一个赞&#x1f44d;吗&#xff0c;感谢❤️ 目录 一. 关键字二. 命名空间2.1 命名空间的定义2.2 命名空间的使用a. 命名空间名称作用域限定…...

编程日记 2024/10/7 5:06:14

网络层——IP

IP地址 结构&#xff1a; 由32位二进制数组成&#xff0c;通常用点分的形式被分为四个部分&#xff0c;每个部分1byte&#xff0c;最大值为255。 从功能的角度看&#xff0c;ip地址由两部分组成&#xff0c;网络号和主机号。网络号标识了ip所在的网段&#xff0c;主机号标识了…...

编程日记 2024/10/7 5:05:12

随笔 漫游互联网

网络编程基础&#xff1a;漫游互联网 温故而知新&#xff0c;可以为师矣。互联网我们可以想象成一个立体的网状结构&#xff0c;由一个一个的小网络组成的网状结构&#xff0c;在一个一个小网络中通过一台一台机器组成&#xff0c;经过几十年的发展终于有了今天这个样子。谈论…...

编程日记 2024/10/7 5:02:08

8.9K Star，开源自托管离线翻译引擎

Hi&#xff0c;骚年&#xff0c;我是大 G&#xff0c;公众号「GitHub 指北」会推荐 GitHub 上有趣有用的项目&#xff0c;一分钟 get 一个优秀的开源项目&#xff0c;挖掘开源的价值&#xff0c;欢迎关注。 在全球化的今天&#xff0c;跨语言交流已成为日常需求&#xff0c;然…...

编程日记 2024/10/7 5:01:07

MySQL基础之DML

MySQL基础之DML 语法不区分大小写 分类 DD(definition)L 定义DM(manipulation)L 操作DQ(query)L 查询DC(control)L 控制 添加数据 # 指定字段添加数据(一条)insert into 表名(字段1,字段2,...) values(值1,值2,...);# 全部字段添加数据(一条)insert into 表名 values(值1,值…...

编程日记 2024/10/7 4:57:57

男单新老对决：林诗栋VS马龙，巅峰之战

听闻了那场激动人心的新老对决&#xff0c;不禁让人热血沸腾。在这场乒乓球的巅峰之战中&#xff0c;林诗栋与马龙的对决无疑是一场视觉与技术的盛宴。 3:3的决胜局&#xff0c;两位选手的每一次挥拍都充满了策略与智慧&#xff0c;他们的每一次得分都让人心跳加速。 林诗栋&am…...

编程日记 2024/10/7 4:56:55

Java如何判断堆区中的对象可以被回收了？

如何判断堆区中的对象可以被回收了 在Java中&#xff0c;垃圾回收机制会帮助我们自动回收不再被使用的对象&#xff0c;已到达即使释放内存的效果&#xff0c;但是Java又是怎么知道哪些对象不会再被我们继续使用了呢&#xff0c;希望你通过本篇文章&#xff0c;理解引用计数法与…...

编程日记 2024/10/7 4:54:53

.Net 6.0 监听Windows网络状态切换

上次发了一个文章获取windows网络状态&#xff0c;判断是否可以访问互联网。传送门&#xff1a;获取本机网络状态 这次我们监听网络状态切换&#xff0c;具体代码如下&#xff1a; public class WindowsNetworkHelper {private static Action<bool>? _NetworkStatusCh…...

编程日记 2024/10/7 4:50:49

UE4 材质学习笔记01（什么是着色器/PBR基础）

1.什么是shader 着色器是控制屏幕上每个像素颜色的代码&#xff0c;这些代码通常在图形处理器上运行。 现如今游戏引擎使用先进的基于物理的渲染和照明。而且照明模型模型大多数是被锁定的。 因此我们创建着色器可以控制颜色&#xff0c;法线&#xff0c;粗糙度&#xff0c;…...

编程日记 2024/10/7 4:49:48

算法 | 位运算（哈希思想）

位运算 &与两个位都为1时&#xff0c;结果才为1&#xff08;有0为0&#xff09;|或两个位都为0时&#xff0c;结果才为0&#xff08;有1为1&#xff09;^异或两个位相同为0&#xff0c;相异为1~取反0变1&#xff0c;1变0<<左移各二进位全部左移若干位&#xff0c;高…...

编程日记 2024/10/7 4:48:47

前端提升方向

1、脚手架配置&#xff1a;首先你会发现&#xff0c;一旦团队项目里多个项目之间的配置或者规范不同步&#xff0c;那么每个项目的配置都需要手动修改&#xff0c;而这很浪费时间。所以&#xff0c;你可以发起了一个团队的脚手架项目&#xff0c;把项目中的代码规范、Vite 配置…...

编程日记 2024/10/7 4:46:44

深度学习基础—残差网络ResNets

1.残差网络结构 当网络训练的很深很深的时候&#xff0c;效果是否会很好&#xff1f;在这篇论文中&#xff0c;作者给出了答案&#xff1a;Deep Residual Learning for Image Recognitionhttps://www.cv-foundation.org/openaccess/content_cvpr_2016/papers/He_Deep_Residual_…...

编程日记 2024/10/7 4:45:43

[特殊字符] 智能合约中的数据是如何在区块链中保持一致的？

&#x1f9e0; 智能合约中的数据是如何在区块链中保持一致的&#xff1f; 为什么所有区块链节点都能得出相同结果&#xff1f;合约调用这么复杂&#xff0c;状态真能保持一致吗&#xff1f;本篇带你从底层视角理解“状态一致性”的真相。 一、智能合约的数据存储在哪里&#xf…...

编程新知 2025/7/12 23:55:04

变量 varablie 声明- Rust 变量 let mut 声明与 C/C++ 变量声明对比分析

一、变量声明设计&#xff1a;let 与 mut 的哲学解析 Rust 采用 let 声明变量并通过 mut 显式标记可变性&#xff0c;这种设计体现了语言的核心哲学。以下是深度解析&#xff1a; 1.1 设计理念剖析 安全优先原则&#xff1a;默认不可变强制开发者明确声明意图 let x 5; …...

编程新知 2025/7/23 4:47:55

装饰模式（Decorator Pattern）重构java邮件发奖系统实战

前言 现在我们有个如下的需求&#xff0c;设计一个邮件发奖的小系统&#xff0c; 需求 1.数据验证 → 2. 敏感信息加密 → 3. 日志记录 → 4. 实际发送邮件 装饰器模式&#xff08;Decorator Pattern&#xff09;允许向一个现有的对象添加新的功能&#xff0c;同时又不改变其…...

编程新知 2025/9/14 11:23:04

Axios请求超时重发机制

Axios 超时重新请求实现方案 在 Axios 中实现超时重新请求可以通过以下几种方式&#xff1a; 1. 使用拦截器实现自动重试 import axios from axios;// 创建axios实例 const instance axios.create();// 设置超时时间 instance.defaults.timeout 5000;// 最大重试次数 cons…...

编程新知 2025/9/5 19:39:35

根据万维钢·精英日课6的内容，使用AI（2025）可以参考以下方法：

根据万维钢精英日课6的内容&#xff0c;使用AI&#xff08;2025&#xff09;可以参考以下方法&#xff1a; 四个洞见 模型已经比人聪明&#xff1a;以ChatGPT o3为代表的AI非常强大&#xff0c;能运用高级理论解释道理、引用最新学术论文&#xff0c;生成对顶尖科学家都有用的…...

编程新知 2025/8/19 6:37:10

代码随想录刷题day30

1、零钱兑换II 给你一个整数数组 coins 表示不同面额的硬币&#xff0c;另给一个整数 amount 表示总金额。 请你计算并返回可以凑成总金额的硬币组合数。如果任何硬币组合都无法凑出总金额&#xff0c;返回 0 。 假设每一种面额的硬币有无限个。 题目数据保证结果符合 32 位带…...

编程新知 2025/9/2 8:07:37

6个月Python学习计划 Day 16 - 面向对象编程（OOP）基础

第三周 Day 3 &#x1f3af; 今日目标 理解类&#xff08;class&#xff09;和对象&#xff08;object&#xff09;的关系学会定义类的属性、方法和构造函数&#xff08;init&#xff09;掌握对象的创建与使用初识封装、继承和多态的基本概念&#xff08;预告&#xff09; &a…...

编程新知 2025/7/7 9:39:54

Java 与 MySQL 性能优化：MySQL 慢 SQL 诊断与分析方法详解

文章目录 一、开启慢查询日志&#xff0c;定位耗时SQL1.1 查看慢查询日志是否开启1.2 临时开启慢查询日志1.3 永久开启慢查询日志1.4 分析慢查询日志 二、使用EXPLAIN分析SQL执行计划2.1 EXPLAIN的基本使用2.2 EXPLAIN分析案例2.3 根据EXPLAIN结果优化SQL 三、使用SHOW PROFILE…...

编程新知 2025/7/24 5:10:25

数据库正常，但后端收不到数据原因及解决

从代码和日志来看&#xff0c;后端SQL查询确实返回了数据&#xff0c;但最终user对象却为null。这表明查询结果没有正确映射到User对象上。 在前后端分离&#xff0c;并且ai辅助开发的时候&#xff0c;很容易出现前后端变量名不一致情况&#xff0c;还不报错&#xff0c;只是单…...

编程新知 2025/7/21 8:35:44

轻量级Docker管理工具Docker Switchboard

简介 什么是 Docker Switchboard &#xff1f; Docker Switchboard 是一个轻量级的 Web 应用程序&#xff0c;用于管理 Docker 容器。它提供了一个干净、用户友好的界面来启动、停止和监控主机上运行的容器&#xff0c;使其成为本地开发、家庭实验室或小型服务器设置的理想选择…...

编程新知 2025/9/7 21:03:49