资讯专栏INFORMATION COLUMN

纯css实现叉号

张宪坤 / 904人阅读

HMTL部分

CSS部分

.close {
  position: absolute;
  right: 32px;
  top: 32px;
  width: 32px;
  height: 32px;
}
.close:before, .close:after {
  position: absolute;
  left: 15px;
  content: " ";
  height: 33px;
  width: 2px;
  background-color: #333;
}
.close:before {
  transform: rotate(45deg);
}
.close:after {
  transform: rotate(-45deg);
}

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/117423.html

相关文章

  • css实现叉号

    HMTL部分 CSS部分 .close { position: absolute; right: 32px; top: 32px; width: 32px; height: 32px; } .close:before, .close:after { position: absolute; left: 15px; content: ; height: 33px...

    CrazyCodes 评论0 收藏0
  • CSS画简单图标

    摘要:用画了三个图标,叉号,排行符号,搜索符号。我们用和伪类来分别当一个矩形框,然后进行旋转即可得到叉号。我们用添加类的形式插入叉号,当我们需要插入叉号时,我们额外添加一个标记,并添加类。方便相对于父元素进行定位第二步,设置伪类,画叉号。 用CSS画了三个图标,叉号,排行符号,搜索符号。先上效果图啦啦啦。showImg(https://segmentfault.com/img/bVGzIw?...

    since1986 评论0 收藏0
  • 超简单实现Android自定义Toast(附源码)

    摘要:还有另外一个特点就是系统自带采用的是队列的方式,等当前消失后,下一个才能显示出来而会把当前顶掉,直接显示最新的。那么,简单三步,我们现在就开始自定义一下吧一要自定义,首先我们需要一个布局。 本Demo有更新, 可以在没有通知权限的情况下正常弹出Toast, 感兴趣的同学可以克隆git: https://github.com/Bamboy120315/BamToast Bamboy的自...

    oogh 评论0 收藏0
  • electron开发过程中遇到的一些坑

    摘要:导致下载流程受阻问题中使用到子进程的时候,是把子进程当作一个外部依赖来做的,打包后并不会将子进程的代码打进到包中,需要额外进行配置。子进程中用的第三方包都需要在中进行配置。 在公司开发的下载器过程中,遇到的一些坑点 1.electron中弹窗的确认取消以及系统自带的叉号之间的关系 场景:在用户退出app时,需要提示用户是否确认退出,此时弹窗出现,如果点击确认就继续退出,执行回调,否则的...

    FingerLiu 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<