css

一般用于右上角关闭弹窗
#pdclose {
width: 18px;
height: 18px;
cursor: pointer;
float: right;
position: relative;
overflow: hidden;
margin-top: 10px;
} #pdclose:after {
width: 100%;
position: absolute;
height: 1.5px;
background: #fff;
content: "";
top: 9px;
left: 0;
transform: rotate(134deg);
-ms-transform: rotate(134deg);
-moz-transform: rotate(134deg);
-webkit-transform: rotate(134deg);
-o-transform: rotate(134deg); } #pdclose:before {
width: 100%;
position: absolute;
height: 1.5px;
background: #fff;
content: "";
top: 9px;
right: 0;
transform: rotate(45deg);
-ms-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-webkit-transform: rotate(45deg);
-o-transform: rotate(45deg);
}

html

<span id="pdclose"></span>

效果

css画叉叉(一般用于关闭按钮)的更多相关文章

  1. amazeui学习笔记--css(常用组件4)--关闭按钮Close

    amazeui学习笔记--css(常用组件4)--关闭按钮Close 一.总结 1.关闭按钮基本用法:关闭按钮样式,可以结合其他不同组件使用.对 <a> 或者 <button> ...

  2. 去掉IE11的叉叉

    在 IE11 下,浏览器自作多情在 text input 组件上加一个 close 叉叉: 用CSS伪类定义: input::-ms-clear { display: none; }

  3. IE input X 去掉文本框的叉叉和密码输入框的眼睛图标

    从IE 10开始,type="text" 的 input 在用户输入内容后,会自动产生一个小叉叉(X),方便用户点击清除已经输入的文本对于type="password&q ...

  4. IE8 input X 去掉文本框的叉叉和密码输入框的眼睛图标

    从IE 10开始,type="text" 的 input 在用户输入内容后,会自动产生一个小叉叉(X),方便用户点击清除已经输入的文本 对于type="password& ...

  5. IE input X 去掉文本框的叉叉和password输入框的眼睛图标

    IE input X 去掉文本框的叉叉和password输入框的眼睛图标 从IE 10開始,type="text" 的 input 在用户输入内容后.会自己主动产生一个小叉叉(X) ...

  6. html 输入框显示“小叉叉”的清空方法

    在IE10以下,我们的输入框input会出现小叉叉.怎么解决这个问题呢? 针对input框我们做一个处理 <style type="text/css"> input:: ...

  7. 一步一步教你用CSS画爱心

    今天小颖给大家分享一个用CSS画的爱心,底下有代码和制作过程,希望对大家有所帮助. 第一步: 先画一个正方形.如图: <!DOCTYPE html> <html> <he ...

  8. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  9. Effective前端3:用CSS画一个三角形

    p { text-indent: 2em } .triangle-container p { text-indent: 0 } img { margin: 15px 0 } 三角形的场景很常见,打开一 ...

  10. 用css画出三角形

    看到有面试题里会有问到如何用css画出三角形 众所周知好多图形都可以拆分成三角形,所以说会了画三角形就可以画出很多有意思的形状 画出三角形的原理是调整border(边框)的四个方向的宽度,线条样式以及 ...

随机推荐

  1. 关于Too many levels of symbolic links和 /usr/bin/env: node: 没有那个文件或目录

    由于node装了两遍在运行bower install的时候就会报错Too many levels of symbolic links要卸载其中一个nodejs,卸载的方法: 1. 卸载node npm ...

  2. hitcon_2018_children_tcache(off by null)

    拿到题目例行检查 (我就不放了) 将程序放入ida中 很明显的堆的题目,然后我们进入add函数 可以看到将s复制到dest里面,说明存在off by null 漏洞 这道题目我也上网查询了师傅们的wp ...

  3. [BUUCTF]REVERSE——[BJDCTF2020]JustRE

    [BJDCTF2020]JustRE 附件 步骤: 例行查壳儿,无壳儿,32位程序 32位ida载入,main函数没看懂,shift+f12检索了一下程序里的字符串,发现了一个类似于flag的字符串 ...

  4. [BUUCFT]PWN——pwn2_sctf_2016

    pwn2_sctf_2016[整数溢出+泄露libc] 题目附件 步骤: 例行检查,32位,开启了nx保护 试运行一下程序,看看大概的执行情况 32位ida载入,shift+f12检索程序里的字符串, ...

  5. 祭出“成本”列(Project)

    <Project2016 企业项目管理实践>张会斌 董方好 编著 今天开始成本. 张同学说,成本就是balabalabala-- 好吧,本妖向来不会背名词解释,不过有些公式还是需要背一下下 ...

  6. 材料资源和成本资源(Project)

    <Project2016 企业项目管理实践>张会斌 董方好 编著 第二种资源就是[材料资源]啦~ 拿到资源第一件事就是输入基本信息,这个,不复读了,复读得我自己都嫌烦.好吧,还得说明一下, ...

  7. 什么是网络图(Project)

    <Project2016 企业项目管理实践>张会斌 董方好 编著 名词解释:网络图-- 咦?书里没写? 看来张同学也不喜欢名词解释(猜的)哈哈哈-- 但是! 人家写了两种网络图:双代号网络 ...

  8. 记一次Linux bash 命令行卡顿排查之警惕LD_PRELOAD环境变量

    现象: 通过屏幕或者ssh登录Linux操作系统(本例:Ubuntu)后,执行ls 需要数秒才返回 strace -c ls 查看实际命令调用耗时并不长 对比和正常执行的主机命令执行时,加载的库文件差 ...

  9. 写在LeetCode刷题600题

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 从2015年9月刷题至今,我终于在LeetCode刷够600道题了.从刚开始的Java语 ...

  10. 菜鸟物流的运输网络(计蒜客复赛F)

    菜鸟物流有自己的运输网络,网络中包含 nn 个城市物流集散中心,和 mm 对城市之间的运输线路(线路是双向的).菜鸟物流允许淘宝卖家自行确定包裹的运输路径,但只有一条限制规则:不允许经过重复的城市.淘 ...