遇到CSS中content属性值乱码----暂时解决的方法

最新推荐文章于 2024-05-03 14:55:36 发布
最新推荐文章于 2024-05-03 14:55:36 发布
阅读量1.5k 收藏 1
点赞数
文章标签： css css3
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/a23_23/article/details/115678376
版权

放在前面：Unicode 字符百科

做网站的时候找了个模板，看的时候发现一些小图标突然没有了。。。一查发现content属性里的值都乱码了，然后又是一连串的查询

在这里插入图片描述
首先这边content属性后面填的应该是Unicode编码
常用 Unicode 符号列表：常用 Unicode 符号列表
推荐博客：css3中的content字符编码
在这里插入图片描述

再就是去查Unicode编码，找到对应的字符，把需要的地方改了过来。
这是改前后的对比：
在这里插入图片描述

_23_
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
css属性 content
liting_1992的博客
10-29 1万+
CSS的 content CSS 属性用于在元素的 ::before 和 ::after 伪元素中插入内容。使用content 属性插入的内容都是匿名的可替换元素。 值 1.默认值：normal：: :before 和 :after 伪类元素中会被对待none 2.none ： 不会产生伪类 3.string 4.url：图片路径。URI 值会指定一个外部资源（图片的url）。如果该不能展示，它会被图片忽略或显示一些占位（如无图片标志）。 注：这种方式引入的图片，无法设置图片的宽高 5.attr()：
css不常见属性之pointer-events的使用方法
12-03
MDN 上介绍为 CSS 属性指定在什么情况下 (如果有) 某个特定的图形元素可以成为鼠标事件的 target。 pointer-events 属性值有: /* Keyword values */ pointer-events: auto; pointer-events: none; pointer-events: ...
深入理解css中的align-content属性
09-24
下面小编就为大家带来一篇深入理解css中的align-content属性。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
解决Chrome浏览器控制台请求返回值中的中文显示为乱码的问题
u010234868的专栏
05-20 6823
1. 首先下载Chrome-Charset浏览器扩展程序： 下载地址：https://github.com/jinliming2/Chrome-Charset 找到右侧的releases： 下载Source code (zip)版本； 2. 解压下载好的Source code (zip)，打开Chrome浏览器扩展程序，选择“加载已解压的扩展程序 ”添加已解压的文件： 3. 点击Chrome浏览器地址栏右侧的扩展程序图标，选择charset右侧的图钉，可以将其固定在地址栏右侧，方便后续使用
关于 css 伪元素 content属性值 为中文字符时出现乱码问题的处理
m0_66722601的博客
09-12 1001
关于 css 伪元素 content属性值 为中文字符时出现乱码问题的处理
css里content使用中文乱码，以及中文转unicode怎么在css样式里使用？
学习前端这门手艺，栈底到栈顶依次是：浏览器架构、Web 网络、事件循环机制、JavaScript 核心、V8 的内存管理、浏览器的渲染流程、Web 安全、CSS、React、Vue、Node、构建工具链等
08-26 4953
问题 比如：我们要使用伪类生成一段文字的时候，我们可以使用Unicode，下面用选择事项【上下切换，按回车确认】一段文字为例，我们用中文直接写的时候会出现下面乱码问题： .test::before { content: '选择事项【上下切换，按回车确认】' } 使用方法 先将选择事项【上下切换，按回车确认】转为 Unicode 编码 工具可以用这个网址https://www.bejson.com/convert/unicode_chinese/转换 输入中文： 点击中文转 Unicode \
js加载乱码，css加载乱码，已经设置编码格式位UTF8，浏览器加载后查看乱码
weixin_41435451的博客
07-02 1295
我在jsp页面中引用js和css发生乱码 检查jsp页面编码格式，js编码格式 <%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%> <script type="text/javascript" src="<%=path %>/personal_zone/src/js/jquery....
css样式中 before、after 里面的 content 乱码
qq_45327886的博客
10-24 1226
css样式中before、after 里面的 content 乱码
content属性为中文时导致html页面乱码问题
weixin_34122548的博客
04-26 998
　　最近项目中遇到了页面乱码问题，具体如下： 　　 　　其中这段是用了一个a标签，因为文案需要根据情况做"收起”和“展开”两种文案的切换，所以利用伪类before，设置其content属性为中文：收起或者展开，但是在测试过程中，发现有时页面会出现乱码的情况，如上图。 　　检查HTML文件和CSS文件的编码格式，都是utf-8，并且html文件里也设置了<meta http-equiv=...
网页使用Font Awesome图标字体时，css定义 content 属性
热门推荐
zsg88的专栏
03-21 5万+
网页使用Font Awesome图标字体时，css定义 content 属性必不可少，如下所示： .icon:before {     content: '\f005';     font-family: FontAwesome; } 代码 \f005 是一个星星的图标对应代码是.fa-star。 不用 content 属性类来输出font awesome图标这个写法，图标代码
css伪类中的content: "\f300"
billhepeng的专栏
11-19 624
.fa-barhorizontal-chart:before { content: "\f300"; } 这个选择器的伪类的字体是：font-family:FontAwesome;并且应该是4.X版的，图标字体；可以去官网：fontawesome点io查看。 CSS伪类是用来添加一些选择器的特殊效果。 解释：在感觉上伪类可以是动态的，当用户和文档进行交互的时候一个元素可以获取或者失去...
细说CSS3中box属性中的overflow-x属性和overflow-y属性值的效果
01-19
大家可以发现，上网站上查询之后会得到overflow-x和overflow-y的一大堆属性值，但很多网站并...no-content：如果内容不适合内容框，则隐藏整个内容，但目前该属性值不被支持 这里值得再细说一下的是visible。我们一般
CSS3中border-radius属性设定圆角的使用技巧
01-21
border-radius CSS3中的代表——第一个在社区中得到广泛使用新属性。这意味着，除去Internet Explorer 8及更低版本，所有的浏览器可以显示圆角。为了使样式能正确应用，需要为Webkit和Mozilla内核添加前缀。 CSS ...
有关CSS中排版常见问题（清除默认样式问题 + 元素居中问题 + 元素之间的空白问题 + 行内块的幽灵空白问题）
秋刀鱼不做梦的编程日常
05-01 930
有关CSS中排版常见问题（清除默认样式问题 + 元素居中问题 + 元素之间的空白问题 + 行内块的幽灵空白问题）
第二弹：走进CSS世界，学习记录
weixin_64638001的博客
04-29 812
当选择器包含多种选择器时，需要将多种选择器优先级相加然后进行比较。选择器的优先级不会超过它最大数量级，如果选择器优先级一样，则使用靠后的样式。子选择器：选择器1 > 选择器2 表示选择器1的子元素为选择器2(只有父子关系才可以)。相邻选择器：选择器1 + 选择器2 表示选择紧贴在选择器1之后的选择器2元素。兄弟选择器：选择器1 ~ 选择器2 表示选择器1后面的所有兄弟元素选择器2。包含选择器：选择器1 选择器2 表示选择器2被选择器1包含即可。组合选择器：选择器1,选择器2 多个选择器之间用逗号分隔。
CSS之显示覆盖内容（z-index）
qq_60624992的博客
04-27 802
我们有的时候，希望下方的内容能够显示到上方，达到类似于多个图层的效果，此时我们可以利用z-index这个属性。z-index属性值是用来设置元素的堆叠顺序(元素层级)。
CSS 伪类、伪元素的应用实例：电池充电、高能进度条
无解的菜鸟晖 的博客
04-30 955
本文通过 CSS 伪类、伪元素，结合动画 animation 和 Vue 动态样式属性（通过 CSS 变量）的写法，来实现电池充电、高能进度条的效果。 CSS 伪类是对当前元素下，处于某些特定状态时而添加特殊效果的样式（基于文档之外的抽象，所以叫伪类），不产生新元素，写法用单冒号（:）开头。 CSS 伪元素是对当前元素下，某些特殊部位应用样式，通过创建虚拟元素实现，一般与 content 属性一起使用（基于元素的抽象，所以叫伪元素），写法用双冒号（::）开头。CSS 变量 var() 用于插入自定义属性。
HTML_CSS学习：常用文本属性
最新发布
m0_74972727的博客
05-03 294
【代码】HTML_CSS学习：常用文本属性。
css代码的定位及浮动
2401_83693610的博客
04-28 434
上次，我们解除了css的内外边距、鼠标悬停及其练习。现在我们学习css元素练习和定位。
justify-content的属性值
11-30
justify-content是CSS中用于设置弹性盒子（flexbox）元素在主轴上的对齐方式的属性。它有以下几个常用的属性值： 1. flex-start：弹性盒子元素向主轴起始位置对齐。 2. flex-end：弹性盒子元素向主轴结束位置对齐。...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值