css 元素前后添加图标(::before 和 ::after 的妙用)

在这里插入图片描述

<template><div class="container"><div class="label">猜你喜欢</div></div>
</template><style lang="scss" scoped>
.label {display: flex;&::before,&::after {content: "";width: 20px;height: 20px;background-image: url(./bubble.png);background-size: contain;margin: -2px 10px;}
}
.container {margin: 30px;
}
</style>

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

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

相关文章

C++面试宝典第4题:合并链表

题目 有一个链表&#xff0c;其节点声明如下&#xff1a; struct TNode {int nData;struct TNode *pNext;TNode(int x) : nData(x), pNext(NULL) {} }; 现给定两个按升序排列的单链表pA和pB&#xff0c;请编写一个函数&#xff0c;实现这两个单链表的合并。合并后&#xff0c;…

井盖发生位移怎么办?智能井盖传感器效果

井盖位移是一种严重的安全隐患&#xff0c;因为它可能导致道路受阻并干扰正常的交通&#xff0c;还可能对行人和车辆的安全造成威胁。为了有效应对这一问题&#xff0c;智能井盖传感器的应用提供了一种解决方案。智能井盖传感器可以实时监测井盖的位移情况&#xff0c;并在发现…

15、lambda表达式、右值引用、移动语义

前言 返回值后置 auto 函数名 (形参表) ->decltype(表达式) lambda表达式 lambda表达式的名称是一个表达式 (外观类似函数)&#xff0c;但本质绝非如此 语法规则 [捕获表] (参数表) 选项 -> 返回类型 { 函数体; }lambda表达式的本质 lambda表达式本质其实是一个类…

(1)(1.5) FrSky telemetry

文章目录 前言 1 设置 2 Turnigy 9XR Pro 前言 FrSky 遥测技术允许你显示 ArduPilot 的信息&#xff0c;如飞行模式、电池电量和错误信息&#xff0c;以及来自 OpenTx 兼容遥控发射机上其他 FrSky 传感器的信息&#xff0c;甚至包括较旧的 X9R 发射机&#xff08;尽管功能较…

周报:静态页面(酷狗首页)的制作-上

在前端领域学习了HTML和CSS有关知识后&#xff0c;我开始进行对常见网页制作的练习了&#xff0c;本次我尝试制作的是酷狗首页。以下为酷狗首页的样例&#xff1a; 不难发现&#xff0c;酷狗首页和豆瓣首页有很多相似之处&#xff0c;练习酷狗首页就相当于我对常规页面制作的巩…

电影《三大队》观后感

上周点播看了电影《三大队》&#xff0c;这部电影讲述的是三大队警员&#xff0c;在办案过程中&#xff0c;因为把犯罪嫌疑人打死后&#xff0c;锒铛入狱后&#xff0c;后来出来后&#xff0c;再次抓捕犯罪嫌疑人的故事。 &#xff08;1&#xff09;故事情节 有一次&#xff0c…

聚类算法的性能度量

聚类算法的性能度量 聚类算法就是根据数据中样本与样本之间的距离或相似度&#xff0c;将样本划分为若干组&#xff0f;类&#xff0f;簇&#xff0c;其划分的原则&#xff1a;簇内样本相似、簇间样本不相似&#xff0c;聚类的结果是产生一个簇的集合。 其划分方式主要分为两…

Mybatis源码解析5:Mapper执行流程1

Mybatis源码解析5&#xff1a;Mapper执行流程1 1.项目结构2. 源码分析2.1 Mapper代理 MapperProxy#invoke2.2 创建MapperMethod2.2.1 方法名称解析器ParamNameResolve2.2.2 MapperMethod#execute 2.3 DefaultSqlSession2.4 CachingExecutor2.5 SimpleExecutor#doQuery获取连接对…

AD域控环境搭建操作手册

AD域搭建 1、准备环境1.0、介绍什么是域控服务器为什么需要域域控制器的作用部署域服务器需要考虑几个方面什么是活动目录活动目录与DNS的关系 1.1、安装Windows Serve 20191.2、安装Windows101.3、安装域服务1.4、W10加入域环境1.5、OU和域用户的创建1.6、域用户安全策略1.7、…

Wireshark使用技巧

Wireshark作为网络数据软件&#xff0c;功能强大&#xff0c;本专栏介绍仅为冰山一角&#xff0c;仅仅是一个入门级别的介绍&#xff0c;大部分功能还需要在日常工作中进行挖掘。 总结Wireshark软件的使用技巧如下&#xff1a; 1.合理部署Wireshark的位置&#xff0c;从源头保障…

ArkUI Button组件

Button 1.声明button组件 Button(label?:ResourceStr) label是按钮上面显示的文字 如果不传入label 则需要在内部嵌套其他组件 内部嵌套其他组件 可以放入icon图标来构建自己想要的样式 按钮类型 按钮使用type(ButtonType.xxx)属性来设置&#xff0c;xxx的类型分为三种 1.…

导入pgsql中的保存的html数据到hive时,换行符无法被repalce

数据如图所示&#xff1a; 当我使用replace函数 \r\n 、\r 、 \n替换时。无论如何都无法替换 最终发现可以使用chr(ASCII码) 可以匹配到&#xff0c;坑我好久。 replace(replace(replace(replace(replace(bid_html_con, chr(9),),chr(10),),chr(13),),chr(160),),chr(32),)