摘要：<!doctype html><html><head><meta charset="utf-8"><title>CSS边框</title><style type="text/css">* { background: #00CD66;} div {&nb
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>CSS边框</title>
<style type="text/css">
* {
background: #00CD66;
}
div {
border: 8px solid #FFD700;
width: 200px;
height: 100px;
line-height: 120px;
margin: 10px auto;
text-align: center;
font-family: "微软雅黑";
font-size: 20px;
font-style: normal;
color: #590;
}
.div1 {
border-radius: 30px;
}
.div2 {
border-top-left-radius: 3em;
border-bottom-right-radius: 3em;
}
.div3 {
border-bottom-left-radius: 3em;
border-bottom-right-radius: 6em;
}
.div4 {
border-left-style: dashed;
border-right-style: dotted;
}
.div5 {
border-left-style: double;
border-right-style: ridge;
}
.div6 {
border-style: groove;
}
.div7 {
border-style: inset;
}
.div8 {
border-style: outset;
}
.div9 {
border-width: 8px;
border-radius: 30px;
width: 1000px;
height: 100px;
}
</style>
</head>
<body>
<div class='div1'>radius</div>
<div class='div2'>部分圆角</div>
<div class='div3'>部分圆角</div>
<div class='div4'>dashed和dotted</div>
<div class='div5'>double和ridge</div>
<div class='div6'>groove</div>
<div class='div7'>inset</div>
<div class='div8'>outset</div>
<div class='div9'></div>
</body>
</html>
批改老师：灭绝师太批改时间：2019-03-11 09:11:57
老师总结：练习的很全面,完成的不错 , 继续加油!
