div border-radius
可以画个1/4之一的圆也可以画整个圆
<html>
<style type="text/css">
div{
background-color: #000;
width: 100px;
height: 100px;
border-radius: 50px;
position: absolute;
} #half{
background-color: #fff;
width: 50px;
height: 50px;
top: 1px;
left: 1px;
position: absolute;
border-radius: 50px 0 0 0 ;
}
</style>
<body>
<div>
<div id="half"></div> </div>
</body>
</html>
效果：
也可以画个半圆
<html>
<style type="text/css">
body{
background-color: #f00;
}
div{
content: "";
position: relative;
left: 200px;
width: 200px;
height: 400px;
border-radius: 0px 200px 200px 0px;
background-color: #fff;
display: block;
}
</style>
<body>
<div></div>
</body>
</html>
div border-radius的更多相关文章
- 如何给div加一个边框border样式
如何给div加一个边框样式? 对div盒子加一个边框样式很简单只需要使用border板块样式即可. 一.虚线与实线边框 边框虚线样式:dashed 边框实现样式:solid border:1px da ...
- css 对div用hover设置border，出现抖动和div走位问题，解决方法
样式设置 : div:hover { border:1px solid red;} 当鼠标移动到div时,产生抖动和偏移. 产生的原因: 是因为设置border时设置了1px边框,多出的这1px,与其 ...
- 重温CSS：Border属性
边界是众所周知的,有什么新的东西吗?好吧,我敢打赌,在这篇文章中,有很多你不看永远不知道的东西! 不仅可以用CSS3来创建圆角,使用原有CSS一样可以显示自定义图形.这是正确的(有待考究):在过去,没 ...
- CSS + radius 五环
使用CSS的外链方式,写了一个五环 CSS的布局 附加radius的使用 思路: 一个大盒子里放两个子盒子: 两个子盒子上下排列,分别放3个和2个盒子用来制作圆环: 大盒子给相对定位,连个子盒子设为绝 ...
- html学习第三天—— 第11章 盒子模型 div
盒模型--边框(一) 盒子模型的边框就是围绕着内容及补白的线,这条线你可以设置它的粗细.样式和颜色(边框三个属性). 如下面代码为div来设置边框粗细为2px.样式为实心的.颜色为红色的边框: div ...
- CSS魔法堂：重拾Border之——图片作边框
前言 当CSS3推出border-radius属性时我们是那么欣喜若狂啊,一想到终于不用再添加额外元素来模拟圆角了,但发现border-radius还分水平半径和垂直半径,然后又发现border-t ...
- 向 div 元素添加圆角边框：
div { border:2px solid; border-radius:25px; }
- css给div添加0.5px的边框
具体代码实现如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- div加边框
一.虚线与实线边框 边框虚线样式:dashed 边框实现样式:solid border:1px dashed #000 代表设置对象边框宽度为1px黑色虚线边框 border:1px solid #0 ...
- border opacity
div { border: 1px solid rgb(127, 0, 0); border: 1px solid rgba(255, 0, 0, .5); -webkit-background-cl ...
随机推荐
- 【转】PFILE和SPFILE介绍
原文:http://blog.sina.com.cn/s/blog_77bba23901017xcl.html 一.PFILE Pfile(Parameter File,参数文件)是基于文本格式的参数 ...
- 如何判断list中是否包含某个元素
在python中可以通过in和not in关键字来判读一个list中是否包含一个元素: str = ['s','i','m','o','n'] if 'e' in str: print("e ...
- PHP图片上传程序（完整版）
从PHP100上搜刮来的,功能很强大.几乎考虑到了每个细节,与大家分享!~~~ <meta http-equiv="Content-Type" content="t ...
- 使用reinterpret_cast的危险
关键字: c++ cast // Cast.cpp : Defines the entry point for the console application. // #include "s ...
- Python学习_列表推导和Lambda表达式
列表推导目的是减少将一个列表转换为另一个列表时所需编写的代码量,其功能也能用列表迭代完成 1.根据要求创建列表threes_and_fives(列表值包括1到15中能够被3或者5正常的数) three ...
- linux中轻松使用backspace和上下按键
linux下使用sqlplus真是太费事儿了,backspace和上下键均出现乱码.在公司服务器上操作时,只能先用delete代替backspace,上下键就直接重新输入代替了,很费时间.今天在自己机 ...
- Java线程监听，意外退出线程后自动重启
Java线程监听,意外退出线程后自动重启 某日,天朗气清,回公司,未到9点,刷微博,顿觉问题泛滥,惊恐万分! 前一天写了一个微博爬行程序,主要工作原理就是每隔2分钟爬行一次微博,获取某N个关注朋友微博 ...
- Essential Sublime Text Plugins
Essential Sublime Text Plugins Add some killer tools to your arsenal. View them all at /repo/sublime ...
- 今天，安装了一个GANGLIA玩玩，以后再测试NAGIOS吧。
说不定以后派得上用场呢.. 还有,NGINX也要学,不能老是凭站IIS,APACHE混饭吃吧,现在它都这么流行了..新浪,网易,腾讯.
- [转贴]C++、C#写的WebService相互调用
以下宏文(原文在 http://blog.sina.com.cn/s/blog_4e7d38260100ade4.html),是转贴并进行了修饰编辑: 首先感谢永和兄提供C++的WebService服 ...