abstract:border边框:边框样式有:solid实线、double双实线、dashed虚线、dotted点状虚线控制单边边框:border-top上、border-left左、border-right右、border-bottom下清除边框:border:none;设置边框圆角:border-radius:20%;设置圆形border-radius:50%设置边框阴影使用box-shadow,具体设置如下
border边框:边框样式有:solid实线、double双实线、dashed虚线、dotted点状虚线
控制单边边框:border-top上、border-left左、border-right右、border-bottom下
清除边框:border:none;设置边框圆角:border-radius:20%;设置圆形border-radius:50%
设置边框阴影使用box-shadow,具体设置如下:box-shadow(x轴 y轴 阴影宽度 阴影验收),如box-shadow(2px 3px 2px #ccc)
边框阴影默认是向外的,但只要加上inset属性,就变成向内阴影了
具体完成案例代码如下: <html> <head> <meta charset="utf-8"> <title>边框</title> <link rel="icon" href="" type="image/x-icon"> <style type="text/css"> .border{ width: 100px; height: 100px; border: none/*1px solid #ccc*/; border-radius: 50%; box-shadow: 0px 10px 100px #ccc; float: left; background-color: #bbb; } </style> </head> <body> <div class="border"></div> <div class="border"></div> </body> </html> <html>
Correcting teacher:灭绝师太Correction time:2019-03-19 09:28:29
Teacher's summary:作业完成的相当认真,加油!后期可以带上实际效果完成!