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 ...
随机推荐
- Mac下安装Scrapy
执行 sudo pip install Scrapy 时会碰到libxml/xmlversion file no found 解决方法: brew install libxml2 brew insta ...
- Python学习_列表推导和Lambda表达式
列表推导目的是减少将一个列表转换为另一个列表时所需编写的代码量,其功能也能用列表迭代完成 1.根据要求创建列表threes_and_fives(列表值包括1到15中能够被3或者5正常的数) three ...
- 阿里云centOS6 下python安装及配置、pip安装及配置、ipython安装及配置
我是在阿里云服务器上进行的python环境搭建,阿里云服务器会自带python但是版本低,所以打算自己安装一个,期间遇到各种问题,而且百度根本不够用无奈上的外网很快解决了.在此分享一下. 一.pyth ...
- Pentaho Data Integration (二) Spoon
上一篇:Pentaho Data Integration笔记 (一):安装 介绍 Spoon Intoduction site: http://wiki.pentaho.com/display/EAI ...
- Java数据库连接关闭后无法启动
错误如下: java.sql.SQLException: No operations allowed after connection closed. at com.mysql.jdbc.Connec ...
- python基础知识（引用）
文章连接:http://xianglong.me/article/how-to-code-like-a-pythonista-idiomatic-python/
- bzoj 3851: 2048 dp优化
3851: 2048 Time Limit: 2 Sec Memory Limit: 64 MBSubmit: 22 Solved: 9[Submit][Status] Description T ...
- POJ 2992 Divisors
每个数都可以分解成素数的乘积: 写成指数形式:n=p1^e1*p2^e2*...*pn^en:(p都是素数) 那么n的因数的数量m=(e1+1)*(e2+1)*...*(en+1): 所以用筛选法筛出 ...
- csu 10月 月赛 H 题 A Very Hard Problem
Description CX老湿经常被人黑,被黑得多了,自己也就麻木了.于是经常听到有人黑他,他都会深情地说一句:禽兽啊! 一天CX老湿突发奇想,给大家出了一个难题,并且声称谁能够准确地回答出问题才能 ...
- 如何把关联性的告警智能添加到 Nagios 上？（2）
上节回顾 对于许多 IT 和运维团队来说,Nagios 既是一个福音也是一个诅咒.一方面,Naigos 在 IT 应用的工作领域中,给予了你可以实时查看告警数据的可能性:但是另一方面,Nagios 也 ...