摘要：<!DOCTYPE html> <html> <head> <title>边框样式</title> <style type="text/css"> .box{ width: 100px;/* */ height: 100px;/*
<!DOCTYPE html>
<html>
<head>
<title>边框样式</title>
<style type="text/css">
.box{
width: 100px;/* */
height: 100px;/* */
/*border:1px solid #ccc;*/ /* solid 实线*/
/*border: 1px double #ccc;*//*double双线*/
/*border: 1px dashed #ccc;*//*虚线*/
border: 1px dotted #ccc;/*点状虚线*/
border-radius:50px; /*圆角属性,可以设置成圆形*/
}
.box2{
width: 100px;/* */
height: 100px;/* */
border-top: 1px solid blue;/*控制上边框*/
border-right: : 1px solid blue;/*控制右边框*/
border-left: 1px solid blue;/*控制左边框*/
border-bottom: : 1px solid blue;/*控制下边框*/
background-color: #ccc;
}
button{
border:none;
}
.shadow{
width: 300px;
height: 40px;
border:1px solid #ccc;
box-shadow: 10px 6px 3px #ccc ;/*外部阴影（默认）*/
box-shadow: 10px 6px 3px #ccc inset;/*内部阴影*/
}
</style>
</head>
<body>
<div class="box"></div>
<div class="box2"></div>
<button>登陆</button>
<!-- 阴影 -->
<div class="shadow"></div>
</body>
</html>
批改老师：灭绝师太批改时间：2018-11-08 16:40:47
老师总结：代码习惯很好，后期熟悉了就不用如此了，继续加油
