纯CSS写的对勾样式
& .cicle{
position: relative;
float: right;
margin-right: -1rem;
vertical-align: middle;
width: 1.4rem;
height: 1.4rem;
border: 1px solid #3399ff;
border-radius: 50%;
}
& .select:after {
content: '\00a0';
display: inline-block;
border: 2px solid #3399ff;
border-top-width: 0;
border-right-width: 0;
width: 9px;
height: 5px;
-webkit-transform: rotate(-50deg);
position: absolute;
top:3px;
left:2px;
}
纯CSS写的对勾样式的更多相关文章
- 纯css写带小三角对话框
在实际样式中经常会遇到要写类似对话框的样式,而这种样式往往会有一个小三角,如下所示: 那么如何用css写出来呢,其实很简单,先让父元素相对定位,然后运用css的伪类before或after.就可以写个 ...
- 纯CSS写三角形-border法
(1)有边框的三角形 我们来写下带边框的三角形. 如果是一个正方形,我们写边时,会用到border,但我们这里讨论的三角形本身就是border,不可能再给border添加border属性,所以我们需要 ...
- 教你两招用纯CSS写Tab切换
说到Tab切换,你可能首先想到的就是使用jQuery,短短几行代码就可以轻松搞定一个Tab切换. 而今天所要分享的,是使用 0 行JS代码来实现Tab切换! 具体效果如下: Tab切换 方法一:模 ...
- 纯CSS实现加载转圈样式
不同的项目中对于等待加载时转圈圈的样式是不同的,有的是传统的转圈的gif图片,见得比较多的是将转圈圈的换成了可爱的图标.有时候项目中加入等待加载的图片会很违和,不符合美观,所以需要用CSS做一个.下面 ...
- 纯CSS打造好看的按钮样式
好看的按钮.链接.div样式,效果预览: http://hovertree.com/code/run/css/s8o19792.html 发现今天积分和排名不错: 代码如下: <!DOCTYPE ...
- 还在为小三角形切图?使用纯CSS写一个简单的三角形
同学们,当美工给的设计图是这样: 或者这样: 我的内心其实是拒绝的-_-:但工作还得干,大部分同学会写 <style> .icon{width:20px;height:20px;displ ...
- 纯CSS写九宫格样式,高宽自适应正方形
<!DOCTYPE html><html> <head> <meta charset="utf-8"> ...
- 拓展-教你手把手用纯CSS写轮播图
先看成品图[示例网址:][1] [1]: https://huruji.github.io/css-imitate-js/slider/index.html一.随便说几句####css3动画效果的强大 ...
- 用纯css写出三角形
1.新建一个元素,随便什么元素,不过我习惯性的会用块元素来做.如果行内元素就display:block它.<div class="triangle"></div& ...
随机推荐
- python 【第二篇】python基本数据类型
python数据类型 python的数据类型和大多数编程语言一样,有int,float,long,string但是python有三个特殊的数据类型:列表,元组,字典 如果不知道你的数据类型有什么方法: ...
- Receiver type ‘X’ for instance message is a forward declaration
这往往是引用的问题. ARC要求完整的前向引用,也就是说在MRC时代可能仅仅须要在.h中申明@class就能够,可是在ARC中假设调用某个子类中未覆盖的父类中的方法的话.必须对父类.h引用,否则无法编 ...
- [办公应用]让WORD自动显示到四级目录
一般情况下,word的目录默认显示到三级目录.如果需要显示到四级目录,你会怎么操作呢? 只要按下图所示,单击“插入”-“引用”-“索引和目录” 然后单击“目录”选项卡,将“显示级别”处的3改为4即可. ...
- 命令行方式下登录SqlPlus,密码含特殊字符
全撞上了! 真难侍候!oracle 12c,想登录sql plus,结果没有图形界面,直接出来个命令行.这下好了,我这个数据库,多实例,意味着登录要指定实例:密码中含有特殊字符"@" ...
- slf4j的总结
参考文章 log4j2使用总结 slf4j介绍以及实现原理窥探 使用Slf4j集成Log4j2构建项目日志系统的完美解决方案 slf4j(全称是Simple Loging Facade For Jav ...
- Struts2逻辑视图与视图资源
- POJ - 3468 A Simple Problem with Integers(线段树区间更新,区间查询)
1.给出了一个序列,你需要处理如下两种询问. "C a b c"表示给[a, b]区间中的值全部增加c (-10000 ≤ c ≤ 10000). "Q a b" ...
- Educational Codeforces Round 22 补题 CF 813 A-F
A The Contest 直接粗暴贪心 略过 #include<bits/stdc++.h> using namespace std; int main() {//freopen(&qu ...
- 使用expdp的心得
第一步:首先使用DBA权限的用户创建directory,我使用system ,可以在服务器本地创建,也可以远程连接sqlplus进行创建,使用的将是服务器上面的路径.要确保创建directory时,操 ...
- 在javascript中,我怎么得到下拉条顶端与当前可视的顶端高度的距离,不是和网页顶端的距离
"滚动条顶端距离" + document.documentElement.scrollTop)