CSS3.0中有一个border-radius属性,这个属性允许向 div 元素添加圆角边框,也就是div边角不再一直是直角,在CSS3.0中可以做成圆角了,所以我们可以用这个属性用div画一个圆,或者同心圆。

圆 代码:

<div style="width:100px; height:100px; border-radius:100px; background-color:#eeeef4;"></div>

同心圆代码:

<div style="width:200px; height:200px; background-color:#FF9; border-radius:200px; ">
    <div style="width:100px; height:100px; position:relative; top:25%; left:25%; border-radius:200px; background-color:#fff;"></div>
</div>

用CSS3.0画圆的更多相关文章

  1. css3.0

    css3.0相比css2.0多了些我们经常需要使用的标签属性,例如:圆角,个别圆角,不透明度,阴影特效等 1.圆角(即如何画圆)border-radius a{width:20px; height:2 ...

  2. 《图形学》实验六:中点Bresenham算法画圆

    开发环境: VC++6.0,OpenGL 实验内容: 使用中点Bresenham算法画圆. 实验结果: 代码: #include <gl/glut.h> #define WIDTH 500 ...

  3. ArcGIS JS 学习笔记2 实现仿百度的拖拽画圆

    一.前言 吐槽一下,百度在国内除了百度地图是良心产品外,其他的真的不敢恭维.在上一篇笔记里,我已经实现了自定义的地图测量模块.在百度地图里面(其他地图)都有一个周边搜索的功能,拖拽画一个圆,然后以圆半 ...

  4. canvas入门(画圆)

    1.想在H5上画一个canvas,必须在页面上你需要的地方添加canvas标签, <canvas id="myCanvas"></canvas>   接着需 ...

  5. 【openGL】画圆

    #include "stdafx.h" #include <GL/glut.h> #include <stdlib.h> #include <math ...

  6. javascript画直线和画圆的方法(非HTML5的方法)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 纯JS画点、画线、画圆的方法

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. OpenGL 3:画圆

    这次使用OpenGL画圆,而且中间画一个实心的五角星. 1. 画实心五角: 由于之前使用Polygen画会出现故障,或许是各个GPU硬件也会不一样的,所以使用Polygen画实心五角星并不可靠: 所以 ...

  9. OpenGL研究2.0 计算圆

    OpenGL研究2.0 计算圆 DionysosLai2014-06-18 在游戏中.常常有些地方涉及到一些圆的轨迹计算,例如一些转轴类的游戏,人物一般在角色转轴上面运动.这时,我们就要时刻计算角色的 ...

随机推荐

  1. PL/SQL Developer 建立远程连接数据库的配置 和安装包+汉化包+注册机

    PL/SQL Developer ,主要是讲一下如何配置PL/SQL Developer ,连接Oracle数据库. [知识点] 1.PL/SQL Developer 是什么? PL/SQL Deve ...

  2. ASP.NET中服务器控件的生命周期

    服务器控件的生命周期是创建服务器控件最重要的概念.作为开发人员,必须对服务器控件生命周期深刻理解.当然,这不是一朝一夕就可以做到的.对于学习控件开发技术的初学者,可以不必掌握得非常详细深入,只需对服务 ...

  3. 洛谷 P2909 [USACO08OPEN]牛的车Cow Cars

    传送门 题目大意: m个车道. 如果第i头牛前面有k头牛,那么这头牛的最大速度会 变为原本的速度-k*D,如果速度小于l这头牛就不能行驶. 题解:贪心 让初始速度小的牛在前面 代码: #include ...

  4. Bean后置处理器 BeanPostProcessor

    1.BeanPostProcessor接口的作用 Bean后置处理器允许在调用初始化方法前后对Bean进行额外的处理,Bean后置处理器对IOC容器的所有bean实例逐一处理,而非单一实例. 我们可以 ...

  5. 2 分支语句——《Swift3.0 从入门到出家》

    2 分支语句 当程序面临多个选择,每一个选择都会执行不同的代码块,这个时候就要使用分支语句.常见的分支语句有: if 选择语句:if... if…else if…elseif…else if是现实生活 ...

  6. Kreyos 资料收集

    Kreyos 资料收集 使用 默认需要连接 APP 解锁. 固件 https://github.com/kreyosopensource/KreyosFirmware Android 源码 https ...

  7. Ambari client

    在研究如何修改YARN的资源池的时候,发现了Hortwork在github上面开源了一个Ambari Client: https://github.com/apache/ambari/tree/tru ...

  8. Linux下查询一个包是32位还是64位

    Linux下查询一个包是32位还是64位 [root@localhost ~]# rpm -qa  --queryformat %-{name}-%{version}-%{release}-%{arc ...

  9. 【转】WINSOCKET客户端编程以及JMETER外部调用

    1 public class SocketClient { 2 OutputStream clientout = null; 3 InputStream clienIn = null; 4 byte[ ...

  10. Apache+PHP多端口多站点

    # # Listen: Allows you to bind Apache to specific IP addresses and/or # ports, instead of the defaul ...