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

【前端基础】10、CSS的伪元素(::first-line、::first-letter、::before、::after)【注:极简描述】

一、伪元素的作用

选取某个特定的元素。

二、::first-line::first-letter

::first-line:针对首行文本设置属性
::first-letter:针对首字母设置属性
在这里插入图片描述
在这里插入图片描述

三、::before::after

在一个元素之前(::before)或者之后(::after)插入其他内容(可以是图片、文字)。
常常通过content属性为一个元素增加修饰性的内容。

代码:
在这里插入图片描述
在这里插入图片描述

结果:
在这里插入图片描述

http://www.dtcms.com/a/196507.html

相关文章:

  • upload-labs通关笔记-第10关 文件上传之点多重过滤(空格点绕过)
  • 【JavaWeb】MySQL
  • Github 2025-05-17 Rust开源项目日报 Top10
  • STM32 | FreeRTOS 递归信号量
  • 理解 plank 自动生成的 copyWithBlock: 方法
  • java函数内的变量问题
  • 永久免费!专为 Apache Doris 打造的可视化数据管理工具 SelectDB Studio V1.1.0 重磅发布!
  • 素数筛(欧拉筛算法)
  • 游戏引擎学习第288天:继续完成Brains
  • 遨游科普:三防平板是什么?有什么功能?
  • 使用Langfuse和RAGAS,搭建高可靠RAG应用
  • AI编码代理的崛起 - AlphaEvolve与Codex的对比分析引言
  • Redis 事务与管道:原理、区别与应用实践
  • 深入理解桥接模式:解耦抽象与实现的设计艺术
  • 给你的matplotlib images添加scale Bar
  • DataX:一个开源的离线数据同步工具
  • 计算机视觉与深度学习 | Python实现EEMD-LSTM时间序列预测(完整源码和数据)
  • Predict Podcast Listening Time-(回归+特征工程+xgb)
  • 基于C语言的歌曲调性检测技术解析
  • NX二次开发——设置对象的密度(UF_MODL_set_body_density)
  • redisson分布式锁实现原理归纳总结
  • JAVA EE_HTTP
  • 仅需三张照片即可生成沉浸式3D购物体验?谷歌电商3D方案全解析
  • 信息系统项目管理师高级-软考高项案例分析备考指南(2023年案例分析)
  • 【通用智能体】Search Tools:Open Deep Research 项目实战指南
  • Ubuntu 安装 squid
  • 【MySQL】第五弹——表的CRUD进阶(三)聚合查询(上)
  • AI:人形机器人的应用场景以及商业化落地潜力分析
  • 神经网络与深度学习第六章--循环神经网络(理论)
  • 16 C 语言布尔类型与 sizeof 运算符详解:布尔类型的三种声明方式、执行时间、赋值规则