css利用border-radius圆角来设置背景为圆角
本文介绍如何使用 CSS 设置背景（或背景图片）为圆角。实现的原理是创建一个div，然后设置div的边框属性border-radius为50%，既可以实现。示例、创建圆角div：<!DOCTYPEhtml><htmllang="en"><head><basetarget="_self"><metahttp-equiv="Content-Type
·
本文介绍如何使用 CSS 设置背景（或背景图片）为圆角。
实现的原理是创建一个div，然后设置div的边框属性border-radius为50%，既可以实现。
示例、创建圆角div：
<!DOCTYPE html>
<html lang="en">
<head>
<base target="_self">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache,must-ridate">
<meta http-equiv="expires" content="0">
<title>设置背景圆角</title>
<style type="text/css">
/*正常div*/
.box0 {
background-color: red;
width: 200px;
height: 200px;
}
/*圆角div*/
.box1 {
background-color: gold;
width: 200px;
height: 200px;
border-radius: 50%;
}
</style>
</head>
<body>
<div class="box0"></div>
<div class="box1"></div>
</body>
</html>以上代码效果如下（黄色圆形即为实现的圆角）:
以上示例，设置的是背景色background-color，我们也可以将背景色修改为背景图片。
有“AI”的1024 = 2048，欢迎大家加入2048 AI社区
更多推荐
0
0- 0
已为社区贡献18条内容
所有评论(0)