摘要:<html> <head> <meta charset="utf-8"> <title>边框</title> <style type="text/css"> body{background:#66b3ff;} *{padding:0px;margin:0px;} h3
<html> <head> <meta charset="utf-8"> <title>边框</title> <style type="text/css"> body{background:#66b3ff;} *{padding:0px;margin:0px;} h3{color:yellow;margin:20px 0px 0px 20px;} span{font-size:2em;color:pink;} .t1{width:100px;height:150px;border:2px;border-radius:15px;background:#ccc;padding-top:10px;padding-left:5px;margin-left:50px;color:#000;} .t2{width:100px;height:150px;border:2px;border:dashed blue;margin:10px 0px 0px 70px;padding-left:3px;background:red;color:#fff;} .t3{width:100px;height:150px;border:dotted green;margin:10px 0px 0px 90px;background:#000;color:#fff;} .t4{width:100px;height:150px;background:pink;border-left:3px solid green;border-bottom:3px solid green;margin:10px 0px 0px 110px;} .t5{width:100px;height:150px;margin:10px 0px 0px 130px;border:none;background:#ccc;box-shadow:6px 3px 3px blue;} .t6{width:100px;height:150px;margin:10px 0px 30px 150px;background:#f75000;box-shadow:inset 0px 20px 80px yellow;} </style> </head> <body> <h3>下面是<span>边框</span>练习的实例</h3><br> <div class="t1">圆角边框</div> <div class="t2">虚线边框</div> <div class="t3">点状边框</div> <div class="t4">只有左下边框</div> <div class="t5">外部阴影</div> <div class="t6">内部阴影</div> </body> </html>
批改老师:灭绝师太批改时间:2018-11-29 16:38:42
老师总结:作业练习比较全面,可以适当加上备注,作为笔记!