在 CSS 中使用 text-emphasis 来增强文本的趣味性

在CSS中设置文本样式的方法有很多。您可以更改颜色、大小、字体,甚至添加阴影和轮廓等效果。但最近,我了解到一个我以前没有听说过的时尚 CSS 属性,它非常棒!

它被称为文本强调(text-emphasis),是 text-emphasis-* 属性组合的简称,可以为文本添加强调标记。这些标记可用于以各种方式突出显示文本,例如在文本上方或下方添加点、圆、双圆或文本。

下面是一个示例,说明如何使用 text-emphasis 点添加到文本中:

.text-emphasis-dot {text-emphasis: dot;
}

这将在文本顶部添加一个点,如下所示。

还可以使用如下 text-emphasis 属性向文本添加双圆:

.text-emphasis-double-circle {text-emphasis: double-circle;
}

这是它的样子。

您也可以使用字母来强调文本。例如,您可以使用 $ 在文本下方添加美元符号,如下所示:

.text-emphasis-dollar {text-emphasis: '$' lime;text-emphasis-position: under;
}

text-emphasis-position 属性用于指定强调标记的位置。可以使用 overunderrightleft 来定位强调标记。

这是它的样子。

哎呀!您甚至可以使用表情符号来强调文本。例如,您可以使用 🔥 在文本中添加火表情符号,如下所示:

.text-emphasis-fire {text-emphasis: '🔥';
}

这是它的样子。

我认为该 text-emphasis 属性是一种有趣的方式,可以增加对文本的强调,并可用于为您的设计增添趣味。大多数现代浏览器都支持它,因此您可以立即开始使用它来使您的文本脱颖而出!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/327815.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

1725 ssm资产管理系统myeclipse开发mysql数据库springMVC模式java编程计算机网页设计

一、源码特点 java ssm资产管理系统是一套完善的web设计系统(系统采用SSM框架进行设计开发,springspringMVCmybatis),对理解JSP java编程开发语言有帮助,系统具有完整的源代码和数据库,系统主要采用B/…

基于STM32F401RET6智能锁项目(BS82166A_3触摸按键)

一、BS81x 特征 • 工作电压:2.2V~5.5V • 低待机电流 • 自动校准功能 • 可靠的触摸按键检测 • 自动切换待机 / 工作模式 • 最长按键输出时间检测 • 具备抗电压波动功能 • Level Hold,可选高有效或低有效 • NMOS 输出内建上拉电阻 /CMOS 直接 输出…

TypeScript学习日志-第二十三天(装饰器Decorator)

装饰器Decorator 一、类装饰器 ClassDecorator 其中返回的 target 是 Http 的构造函数,有了构造函数就不会去破坏其自身原有的结构,当我们 Http 里面有多个属性或者方法的,当是我们不想看或者改变它,这时候可以在构造函数中增加即…

【C++】每日一题 17 电话号码的字母组合

给定一个仅包含数字 2-9 的字符串,返回所有它能表示的字母组合。答案可以按 任意顺序 返回。 给出数字到字母的映射如下(与电话按键相同)。注意 1 不对应任何字母。 可以使用回溯法来解决这个问题。首先定义一个映射关系将数字与字母对应起来…

数学建模——线性回归模型

目录 1.线性回归模型的具体步骤和要点: 1.收集数据: 2.探索性数据分析: 3.选择模型: 4.拟合模型: 5.评估模型: 1.R平方(R-squared): 2.调整R平方(Ad…

2024CCPC全国邀请赛(郑州)暨河南省赛

2024CCPC全国邀请赛(郑州站)暨河南省赛 一铜一银,虽不是线下第一次参赛但是第一次拿xcpc奖牌,还有个国赛奖真是不戳。感谢学长,感谢队友! 虽然遗憾没有冲到省赛金,不过还有icpc商丘&#xff08…

Golang RPC实现-day01

导航 Golang RPC实现一、主体逻辑设计二、服务设计1、监听和接收请求2、处理请求(1)服务结构体定义(2)确认请求方和服务方编解码格式(3)循环读取请求(4)解析请求的内容(5)响应请求 三、读取和发送数据到连接中代码 Golang RPC实现 先来一个最简单的版本,后续更新。…

蜜蜂收卡系统 加油卡充值卡礼品卡自定义回收系统源码 前后端开源uniapp可打包app

本文来自:蜜蜂收卡系统 加油卡充值卡礼品卡自定义回收系统源码 前后端开源uniapp可打包app - 源码1688 卡券绿色循环计划—— 一项旨在构建卡券价值再利用生态的社会责任感项目。在当前数字化消费日益普及的背景下,大量礼品卡、优惠券因各种原因未能有效…

基于 LlaMA 3 + LangGraph 在windows本地部署大模型 (三)

基于 LlaMA 3 LangGraph 在windows本地部署大模型 (三) 大家继续看 https://lilianweng.github.io/posts/2023-06-23-agent/的文档内容 第二部分:内存 记忆的类型 记忆可以定义为用于获取、存储、保留以及随后检索信息的过程。人脑中有多…

PLL-分频器

概念 分频器的性能一般用四个参数来规定:(1)分频比,(2)最大允许输入频率fmax,(3)功耗,(4)最小允许输入电压摆幅(也叫“灵敏度”)。虽然分频器的相位噪声也很重要,但在大多数情况下它可以忽略不计。 把一般分频器的输入灵敏度画成…

HTML常用标签-表单标签

表单标签 1 表单标签2 表单项标签2.1 单行文本框2.2 密码框2.3 单选框2.4 复选框2.5 下拉框2.6 按钮2.7 隐藏域2.8 多行文本框2.9 文件标签 1 表单标签 表单标签,可以实现让用户在界面上输入各种信息并提交的一种标签. 是向服务端发送数据主要的方式之一 form标签,表单标签,其内…

2024年小学生古诗文大会备考:吃透历年真题和知识点(持续)

根据往年的安排,2024年小学生古诗文大会预计这个月就将启动。该如何备考2024年小学生古诗文大会呢?根据往期的经验,只要吃透这些真题和背后的知识点,通过上海小学生古诗文大会的初选(初赛)一点问题都没有。…

中国196个城市边界

中国196个城市的城市边界形状文件是通过对Li等人(2018)的输出进行处理和过滤生成的。根据全球人工不可渗透区域 (GAIA) 数据绘制全球城市边界。 城市建成区边界是城市研究中的一个重要指标,在很多城市研究中都会涉及到…

优先级队列(堆)

目录 leetcode题目 一、数组中两元素的最大乘积 二、最后一块石头的重量 三、数据流中的第 K 大元素 四、前K个高频元素 五、前K个高频单词 六、数据流的中位数 七、有序矩阵中的第K小的元素 八、根据字符出现频率排序 leetcode题目 一、数组中两元素的最大乘积 146…

20【Aseprite 作图】画岩石

1 画一个岩石的框架,不是一个正规的圆,可以把最高点不放在中心,会显得自然 2 用油漆桶填满框架 3 要改变岩石的颜色,可以调整HSV里面的S,降低饱和度 4 描边,和地面连接处可以不描边 5 颜色调得更浅一点,(通过HSV里面的S可以做到),作为亮处的轮廓; 通过把透明度调…

探索智慧生活:百度Comate引领人工智能助手新潮流

文章目录 百度Comate介绍1. 什么是百度Comate?主要特点 2. Comate的核心功能智能问答功能语音识别功能语音助手功能个性化服务 3. Comate 支持哪些语言? 使用教程(以vscode为例)1. 下载和安装Comate3. 常用操作快捷键(windows) 使用体验自然语言生成代码…

【联通支付注册/登录安全分析报告】

联通支付注册/登录安全分析报告 前言 由于网站注册入口容易被黑客攻击,存在如下安全问题: 暴力破解密码,造成用户信息泄露短信盗刷的安全问题,影响业务及导致用户投诉带来经济损失,尤其是后付费客户,风险巨…

未授权访问:ZooKeeper 未授权访问漏洞

目录 1、漏洞原理 2、环境搭建 3、未授权访问 防御手段 今天继续学习各种未授权访问的知识和相关的实操实验,一共有好多篇,内容主要是参考先知社区的一位大佬的关于未授权访问的好文章,还有其他大佬总结好的文章: 这里附上大…

多格式兼容的在线原型查看:Axure RP的便捷解决方案

Axure rp不仅可以绘制详细的产品构思,还可以在浏览器中生成html页面,但需要安装插件才能打开。安装Axure后 rpchrome插件后,还需要在扩展程序中选择“允许访问文件网站”,否则无法在Axure中成功选择 rp在线查看原型。听起来很麻烦…