用css3实现一个带缺口的圆圈（图）
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
.box{
margin:300px;
position:relative;
}
.box1 {
width:100px;
height:100px;
background-color:transparent;
border:3px solid #F00;
border-radius:60px;
margin-top:20px;
}
.box2 {
width:60px;
height:60px;
background-color:#fff;
z-index:1;
border-radius:45px;
position:absolute;
top:0;
left:80px;
}
</style>
</head>
<body>
<div class="box">
<div class="box1"></div>
<div class="box2"></div>
</div>
</body>
</html>
效果图：
用css3实现一个带缺口的圆圈（图）的更多相关文章
- 用CSS画一个带阴影的三角形的示例代码
1. 思路 怎么用CSS3画一个带阴影的三角形呢 ? 有童鞋说, 这还不简单吗 网上有很多解决方案, 但其实大多都是实现不太完美的, 存在一些问题 假设我们做一个向下的三角形箭头 常见的方法大致有两种 ...
- 创建一个带模版的用户控件 V.3
再重构此篇<创建一个带模版的用户控件 V.2>http://www.cnblogs.com/insus/p/4164149.html 让其它动态实现header,Item和Footer. ...
- 创建一个带模版的用户控件 V.2
前面有做练习<创建一个带模版的用户控件>http://www.cnblogs.com/insus/p/4161544.html .过于简化.通常使用数据控件Repeater会有网页写好He ...
- QT模态对话框用法（在UI文件中设置Widget背景图，这个图是一个带阴影边框的图片——酷）
QT弹出模态对话框做法: 1.新建UI文件时,一定要选择基类是QDialog的,我的选择是:Dialog without Buttons(),如下图: 2.然后在使用的时候: MyDialog dlg ...
- 如何编写一个带命令行参数的Python文件
看到别人执行一个带命令行参数的python文件,瞬间觉得高大上起来.牛逼起来,那么如何编写一个带命令行参数的python脚本呢?不用紧张,下面将简单易懂地让你学会如何让自己的python脚本,支持带命 ...
- Java基础---Java---IO流-----File 类、递归、删除一个带内容的目录、列出指定目录下文件夹、FilenameFilte
File 类 用来将文件或者文件夹封装成对象 方便对文件与文件夹进行操作. File对象可以作为参数传递给流的构造函数 流只用操作数据,而封装数据的文件只能用File类 File类常见方法: 1.创建 ...
- 写一个带文本菜单的程序,菜单项如下 (1) 取五个数的和 (2) 取五个数的平均值 (X) 退出。
问题: 写一个带文本菜单的程序,菜单项如下(1) 取五个数的和 (2) 取五个数的平均值(X) 退出. 由用户做一个选择, 然后执行相应的功能.当用户选择退出时程序结束. 实现: ...
- 收藏一个带动画效果的ScrollViewer以及ScrollBar的模板
这里介绍一个带动画效果的ScrollViewer和ScrollBar,总共分为两个资源字典,直接拿来引用即可: 1 ScrollBarStyle.xaml <ResourceDictionary ...
- 使用jQuery和CSS3实现一个数字时钟
点击进入更详细教程及源码下载 在线演示 我们经常会在网站中看见一个时钟的效果.今天向大家分享一个使用jQuery和CSS3实现一个数字时钟教程. http://www.html5cn.org/ ...
随机推荐
- Shell脚本获取C语言可执行程序返回值
#!/bin/sh #./test是c程序,该程序 返回0 ./test OP_MODE=$? echo $OP_MODE # $? 显示最后命令的退出状态.0表示没有错误,其他任何值表明有错误.
- matlab练习程序（碎片）
这个算法是对photoshop中滤镜->像素化->碎片这个功能的学习. PS这个功能好像不带参数,不过我这里有滤波半径r可以进行控制. 因为我是看效果猜算法的,效果肯定有所区别. 我的想法 ...
- Java学习笔记（六）——方法
一.方法定义 1.语法: 其中: (1) 访问修饰符:方法允许被访问的权限范围, 可以是 public.protected.private 甚至可以省略 ,其中 public 表示该方法可以被其他任何 ...
- Linux2.6 内核的 Initrd 机制解析
文章来自:www.ibm.com/developerworks/cn/linux/l-k26initrd/ 1．什么是 Initrd initrd 的英文含义是 boot loader initial ...
- LoadRunner11录制APP脚本（1）
1.测试准备: a.首先安装LoadRunner11.0的版本跟新
- 关于Vector中的元素中含有指针成员的情况
对于容器,当容器的各个元素为类类型,且该类类型中含有指针成员时: 如果类类型的析构函数中包含了对指针变量指向内存的释放操作,则在利用clear()函数删除容器所有元素时,会自动调用类的析构函数,自动实 ...
- ASP.Net MVC开发基础学习笔记（2）：HtmlHelper与扩展方法
一.一个功能强大的页面开发辅助类—HtmlHelper初步了解 1.1 有失必有得 在ASP.Net MVC中微软并没有提供类似服务器端控件那种开发方式,毕竟微软的MVC就是传统的请求处理响应的回归. ...
- nefu 197 KMP
Description 在信息检索系统中一个很重要的环节就是关键字符串的查找,从而很多对自己有用的信息.给你一个很长的一段文字, 和一个关键信息字符串,现在要你判断这段文字里面是否有关键字符串. In ...
- tomcat 部署spring工程乱码解决方案
tomcat的server.xml文件,Connector标签增加useBodyEncodingForURI="true"属性 web.xml如下配置 <filter> ...
- shell实现https登录
服务端提供了两个api: 一个是用于用户认证,因为要传输密钥,所以用了https方式 如何在服务端配置https请见另外一个博文 https://192.168.1.190:8443/api/aut ...