css自定义开关(一个圆里有一个x)
2016-03-03 14:28
531 查看
.close:hover{cursor:pointer;}
.close {
background:gray;
color:white;
border-radius: 12px;
line-height: 20px;
text-align: center;
height: 20px;
width: 20px;
font-size: 18px;
padding: 1px;
position:absolute;
left: 91%;
top:-21px;
}
.close::before {
content: "\2716";
}
<div style="height: 80px; width: 80px; border: 1px solid black; position: relative;">
<span class="close"></span>
</div>
.close {
background:gray;
color:white;
border-radius: 12px;
line-height: 20px;
text-align: center;
height: 20px;
width: 20px;
font-size: 18px;
padding: 1px;
position:absolute;
left: 91%;
top:-21px;
}
.close::before {
content: "\2716";
}
<div style="height: 80px; width: 80px; border: 1px solid black; position: relative;">
<span class="close"></span>
</div>
相关文章推荐
- 发觉前一个项目需求很好玩的两个CSS animation
- CSS3 Animation
- css3(border-radius)边框圆角详解
- [积累]推荐给大家的CSS书写规范、顺序
- 自定义ActionBar的高度、标题与菜单中的文字样式
- 一小时搞定DIV+CSS布局-固定页面开度布局
- css 页脚固定到底部
- CSS书写应该注意的情况
- css盒子模型、文档流、相对与绝对定位、浮动与清除模型
- 简单新闻发布系统前台界面(html+css)
- Css 动画的回调
- CSS布局:水平居中
- css3
- DIV+CSS的命名规则
- css实现强制不换行/自动换行/强制换行
- 什么是 CSS 层叠上下文,它们是如何工作的?
- CSS3 圆形时钟式网页进度条
- CSS格式化文字排版
- css3兼容IE8的方案 各个ie的hack
- [转载]CSS居中完全指南