首页 > 其他分享 >css实现圆形里面感叹号

css实现圆形里面感叹号

时间:2023-09-04 11:33:38浏览次数:34  
标签:exclamation color height 圆形 感叹号 20px circle css

.circle-exclamation {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: inline-block;
    background-color: #eb4d4b;
}
.circle-exclamation::before {
    content: "!";
    font-size: 16px;
    color: #fff;
    line-height: 20px;
    text-align: center;
    display: block;
}

效果

 

 

人生的意义就和这个感叹号一样,我们一直在追寻,一直没有任何的结果;似乎从头就早已注定了一切。那我们何苦一直追寻和改变呢 ?

标签:exclamation,color,height,圆形,感叹号,20px,circle,css
From: https://www.cnblogs.com/wwwcf1982603555/p/17676485.html

相关文章

  • css实现聊天气泡
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"/><metaname="viewport"content="width=device-width,initial-scale=1.0"/><title>聊天气泡</title>......
  • css预编译器: center;}
    CSS预编译器是一种用于构建CSS的工具,它可以将CSS代码转换为更易于管理和维护的格式。它们可以使CSS代码更加灵活,更易于重用,并且可以帮助开发人员更轻松地组织和管理CSS代码。CSS预编译器是一种用于构建CSS的工具,它可以将CSS代码转换为更易于管理和维护的格式。它们可以使CSS代码更......
  • css: A Multi-line CSS only Typewriter effect
     <!doctypehtml><html><head><metacharset="utf-8"><metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-scale=1.0,user-scalable=no"><metahttp-eq......
  • ORACLE 11.2.0.4 RAC Cluster not starting cssd with Cannot get GPnP profile
       最近,处理一次oracle11.2.0.4raccluster由于cssd无法启动,导致集群一个节点的CRS集群无法正常启动的故障。原本,计划变更是从ASM剔除磁盘,解除存储到数据库服务器的映射;磁盘已经成功从ASM剔除,也已经成功从存储解除到操作系统的映射,为了验证磁盘剔除是否对集群有影响,重启了......
  • Django优化模版拆分css文件
    Django优化模版拆分css文件可以发现前面写项目将css放在html一个文件中,虽然简单省事但是带来的问题就是文件过于冗长不方便查看和修改。这里做个分离优化提供两种方式方式一:html和css存放同一目录 将原因html中</style>内容移动到home.css文件中,然后再html移动空白位置,替换......
  • vue项目中全局引入cass(scss)变量和sass(scss) mixin
    1、使用场景variable.scss文件样例//颜色定义规范$color-background:#222;mixin.scss文件样例//背景图片@mixinbg-image($url){background-image:url($url+"@2x.png");@media(-webkit-min-device-pixel-ratio:3),(min-device-pixel-ratio:3){background-i......
  • 20230829-面试题html+css5道题记录
    css预处理工具参考答案:CSS预处理器是一个能让你通过预处理器自己独有的语法来生成CSS的程序。css预处理器种类繁多,三种主流css预处理器是Less、Sass(Scss)及Stylus;它们各自的背景如下:Sass:2007年诞生,最早也是最成熟的CSS预处理器,拥有ruby社区的支持和compass这一最强大的css框......
  • 20230825-面试题html+css5篇简单记录
    html标签的类型(head,body,!Doctype)他们的作用是什么!DOCTYPE标签:它是指示web浏览器关于页面使用哪个HTML版本进行编写的指令.head:是所有头部元素的容器,绝大多数头部标签的内容不会显示给读者该标签下所包含的部分可加入的标签有base,link,meta,script,style和title......
  • CSSE7610互斥算法分析
    Assignment1:MutualexclusionCSSE7610Answerquestions1to3below.Thisassignmentisworth25%ofyourfinalmark.Itistobecompletedindividually,andyouarerequiredtoreadandunderstandtheSchoolStatementonMisconduct,availableontheSchoo......
  • 一个CSS动画的demo
       .lineBarDis{height:8px;background-image:linear-gradient(toright,#011c720%,#c7ced2100%);animation:myAnimation1.5sinfinite;/*设置动画为2秒钟的时间,并无限循环*/}@keyframesmyAnimation{0......