bootstrap怎么把div变成一个圆

PHP中文网 JavaScript

本文摘自PHP中文网，作者(*-*)浩，侵删。

border-radius，国内翻译成圆角，你可能以为这个属性就是用来画圆角，没错，但是除此之外，它还可以做点别的事情。

radius其实指的是边框所在圆的半径，这个CSS3属性不仅能够创建圆角，还可以创建圆形，把这些角按照不同的顺序和大小来展现，能够绘制成多种多样的图形。（推荐学习：Bootstrap视频教程）

利用border-radius将标签设置成圆形，只要将border-radius的值设置成50%，就可以变成圆形。

实例：

1

2

3

4

5

6

7

8

9

<html>

    <head>

 

    </head>

    <body style="width: 99%;height: 1000px;">

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

        <input type="button" style="width: 100px;height: 100px;background-color: #000000;border-radius:50%;" />

    </body>

</html>

效果图：

bdiv.png

更多Bootstrap相关技术文章，请访问Bootstrap教程栏目进行学习！

以上就是bootstrap怎么把div变成一个圆的详细内容，更多文章请关注木庄网络博客！

相关阅读 >>

bootstrap table如何删除行

bootstrap 怎么安装

bootstrap里面有什么东西

使用bootstrap框架有什么好处？

easyui和bootstrap之间有什么区别？

bootstrap支持手机吗

bootstrap是做什么的

bootstrap框架有哪些缺点？

如何去掉bootstrap模态框的遮罩层

详解eclipse中如何使用bootstrap？（附代码）

更多相关阅读请进入《bootstrap》频道 >>




标签：

打赏

取消

感谢您的支持，我会继续努力的!

扫码支持
扫码打赏，您说多少就多少

打开支付宝扫一扫，即可进行扫码打赏哦

分享从这里开始，精彩与您同在

相关推荐

评论

管理员已关闭评论功能...