Css绘制圆形,环形,椭圆等图形
转载自http://blog.csdn.net/gongstrong123/article/details/50888758
绘制圆形,环形,椭圆
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style>
//圆形
.circle1{
width: 200px;
height: 200px;
background-color: blue;
border-radius: 50%;
}
//环形
.circle2{
width: 200px;
height: 200px;
background-color: blue;
border-radius: 50%;
border: 50px solid red;
}
//椭圆
.circle3{
width: 200px;
height: 300px;
background-color: red;
border-radius: 50%;
}
</style>
</head>
<body>
<div class="circle1"></div>
<div class="circle2"></div>
<div class="circle3"></div>
</body>
</html>
还有长方形等各种其他形状
http://www.cnblogs.com/top5/archive/2012/02/14/2351959.html
Css绘制圆形,环形,椭圆等图形的更多相关文章
- Android自定义ImageView实现图片圆形 ,椭圆和矩形圆角显示
Android中的ImageView只能显示矩形的图片,为了用户体验更多,Android实现圆角矩形,圆形或者椭圆等图形,一般通过自定义ImageView来实现,首先获取到图片的Bitmap,然后通过 ...
- CSS 魔法系列:纯 CSS 绘制基本图形(圆、椭圆等)
我们的网页因为 CSS 而呈现千变万化的风格.这一看似简单的样式语言在使用中非常灵活,只要你发挥创意就能实现很多比人想象不到的效果.特别是随着 CSS3 的广泛使用,更多新奇的 CSS 作品涌现出来. ...
- 摘记 史上最强大的40多个纯CSS绘制的图形(一)
今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和网站小图标,真的非常强大,分享给大家. Square(正方 ...
- 史上最强大的40多个纯CSS绘制的图形
Square(正方形) #square { width: 100px; height: 100px; background: red; } Rectangle(矩形) #rectangle { wid ...
- 40多个纯CSS绘制的图形
本文由码农网 – 陈少华原创,转载请看清文末的转载要求. 今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和 ...
- CSS绘制简单图形
究竟该用字体图标.图片图标.还是CSS画一个图标?我也不知道.各有千秋吧.本文将介绍如何用css绘制简单的图形,所有测试在chrome58.0完成,如果你不能得到正确结果请到caniuse查一查看看是 ...
- 史上最强大的40多个纯CSS绘制的图形[转]
今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和网站小图标,真的非常强大,分享给大家. Square(正方 ...
- 用CSS绘制最常见的40种形状和图形
今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形,里面有最简单的矩形.圆形和三角形,也有各种常见的多边形,甚至是阴阳太极和网站小图标,真的非常强大,分享给大家. Square(正方 ...
- 纯CSS绘制的图形一览
整理网上一些使用纯CSS绘制的图形示例~~纯属抄袭,哈哈...仅仅是为了自己以后查看! Square(正方形) #square { width: 100px; height: 100px; backg ...
随机推荐
- ASP.NET MVC WEB API字段出现k__BackingField
参考博客:C#对 Json的序列化和反序列化会出现"k_BackingField"
- 解决Chrome flash过期
解决Chrome flash过期的办法安装Adobe Flash Player PPAPI
- winserver2008 management note
1,磁盘online及介质保护 Windows server 2008 增加的磁盘无法初始化-提示:介质受写入保护.插了下相关说明,在VMware的帖子找到了解决办法: 开始-运行,cmd.打开命令提 ...
- DNS压力测试工具dnsperf简介
dnsperf是我最近写的一个开源的DNS压力测试工具,用户可以用它来对DNS服务器或者Local DNS做压力测试.dnsperf目前的实现是单进程模式,通过epoll非阻塞地处理网络事件. dns ...
- layzr.js新版使用方法
转载请注明出处:http://www.cnblogs.com/fiter/p/5413919.html 前言 今天研究这个JS库,本人新手,将官方的js代码下载下来后始终无法正常使用,经过多番尝试,终 ...
- 化繁为简,最简易的SqlDataSource配合Cache使用~
最近一个小项目用了比较方便傻瓜的DevExpress控件,实践中DevExpress的控件确实很方便. 在用ASPxGridView控件的时候,为了偷懒结合了SqlDataSource使用,但一直在大 ...
- Android应用开发中半透明效果实现方案
下面是自定义Activity半透明的效果例子:res/values/styles.xml<resources> <stylename="Transparent " ...
- eclipse设置汉化
1. 打开eclipse->help->install new software 2. 打开http://www.eclipse.org/babel/downloads.php,,,找到相 ...
- 用canvas画环形圆形图片
效果如图自动绘制不停歇 代码如下 var canvas = document.getElementById('myCanvas'),width = canvas.width,height = canv ...
- [liusy.api-SMJ]-MAVEN archetype 创建项目
•选择或创建工作空间 Select a workspace –File – Switch Workspace - other