html中如何将边框变成圆的
程序员文章站
2022-03-03 18:56:07
...
方法:1、使用width和height属性将元素设置为正方形;2、使用“border: 边框大小 solid 颜色值;”给正方形元素添加边框;3、使用“border-radius: 50%;”语句将边框变成圆的。
本教程操作环境:windows7系统、CSS3&&HTML5版、Dell G3电脑。
html中将边框变成圆的
1、创建一个div元素,使用width和height属性将其设置为正方形
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style> div{ width: 100px; height: 100px; background-color: #FFC0CB; } </style> </head> <body> <div></div> </body> </html>
2、添加边框
div{ width: 100px; height: 100px; background-color: #FFC0CB; border: 2px solid black; }
3、将边框变成圆的
div{ width: 100px; height: 100px; background-color: #FFC0CB; border: 2px solid black; border-radius: 50%; }
相关推荐:《html视频教程》
以上就是html中如何将边框变成圆的的详细内容,更多请关注其它相关文章!
上一篇: php怎么获取前几天的时间戳
下一篇: linux如何返回上一级目录
推荐阅读
-
不知大家遇到过这种问题么,一个层宽度设为100%,并设置背景图片,在浏览器中浏览,缩小窗口到滚动条出现,然后拖动滚动条到右侧,右侧的区域变成空白,怎么解决?_html/css_WEB-ITnose
-
iOS如何将字符串中特定后的字变成红色
-
iOS如何将字符串中特定后的字变成红色
-
html5中如何将图片的绝对路径转换成文件对象
-
cad中绘制的圆变成多边形该怎么办?
-
详解移动端Html5页面中1px边框的几种解决方法
-
cad中绘制的圆变成多边形该怎么办?
-
详解移动端Html5页面中1px边框的几种解决方法
-
在Excel中如何将柱形图中的某根或者某几根柱条变成箭头
-
胡博君谈CSS3中的边框的各种效果_html/css_WEB-ITnose