码迷,mamicode.com
首页 > Web开发 > 详细

用css3做一个关闭icon,

时间:2018-05-21 12:43:24      阅读:227      评论:0      收藏:0      [点我收藏+]

标签:技术分享   height   idt   标识   ati   ali   text   bsp   unicode   

html代码:

<div class="nav-icon">
       <div>合作机构授权<span class="close"></span></div>
</div>

css3代码:

.nav-icon{
        position: relative;
        padding: 24px 0;
        background:#ffffff;
        width: 100%;
        font-family: PingFangSC-Regular;
        font-size: 18px;
        color: rgba(0,0,0,0.75);
        letter-spacing: 0;
        text-align: center;
    }
    .close {
       position: absolute;
       right: 10px;
       line-height: 20px;
       font-size: 30px;
       color: #C0C0C0;
    }
    .close::before {
        content: "\00D7";
    }

对于按钮中的叉按钮,用的是Unicode中的一种标识,以下这些也可以使用,标识 编码(16进制) Name 

? \2716 粗体乘法 
? \2717 交叉 
? \2718 粗体交叉 
× \00D7 乘法符号 
? \2A2F 向量乘积 
x \78 小写字母 
X \58 大写字母

效果:

技术分享图片

 

用css3做一个关闭icon,

标签:技术分享   height   idt   标识   ati   ali   text   bsp   unicode   

原文地址:https://www.cnblogs.com/liuyinlei/p/9065920.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!