<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>HTML5圆角例子</title>
<style type="text/css">
body{
background-color: #000000;
}
div{
width: 100px;
height: 100px;
margin: 5px;
border: 5px solid white;
background-color: #efefef;
}
#dv-all{
border-radius:15px;
-webkit-border-radius:15px;
-moz-border-radius:15px;
}
#dv-top-left{
border-top-left-radius:15px;
-webkit-border-top-radius:15px;
-moz-border-top-radius:15px;
}
#dv-top-right{
border-top-right-radius:15px;
-webkit-border-top-right-radius:15px;
-moz-border-top-right-radius:15px;
}
#dv-bottom-left{
border-bottom-left-radius:15px;
-webkit-border-bottom-left-radius:15px;
-moz-border-bottom-left-radius:15px;
}
#dv-bottom-right{
border-bottom-right-radius:15px;
-webkit-border-bottom-right-radius:15px;
-moz-border-bottom-right-radius:15px;
}
</style>
</head>
<body>
<div id="dv-all">全圆角例子</div>
<div id="dv-top-left">左上圆角例子 </div>
<div id="dv-top-right">右上圆角例子</div>
<div id="dv-bottom-left">左下圆角例子</div>
<div id="dv-bottom-right">右下圆角例子</div>
</body>
</html>
html5圆角例子
最新推荐文章于 2022-01-30 18:29:53 发布