css3-4 css3边框样式
一、总结
一句话总结：
二、css3边框样式
1、相关知识
边框属性:
1.border-width
2.border-style
3.border-color
边框方位:
1.border-left:1px solid #f00;
2.border-top:1px solid #f00;
3.border-right:1px solid #f00;
4.border-bottom:1px solid #f00;
2、代码
border边框方位实例
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 <style> 7 *{ 8 font-family: 微软雅黑; 9 } 10 11 p{ 12 border-left:5px solid #f00; 13 padding-left:5px; 14 } 15 </style> 16 </head> 17 <body> 18 <p>linux is very much!</p> 19 <p>linux is very much!</p> 20 <p>linux is very much!</p> 21 <p>linux is very much!</p> 22 <p>linux is very much!</p> 23 <p>linux is very much!</p> 24 </body> 25 </html>
边框样式
1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>index</title> 6 <style> 7 div{ 8 width:1000px; 9 height:200px; 10 11 /*border-style:solid;*/ 12 /*border-style:dotted;*/ 13 /*border-style:dashed;*/ 14 /*border-style:double;*/ 15 /*border-style:inset;*/ 16 /*border-style:outset;*/ 17 /*border-style:groove;*/ 18 border-style:ridge; 19 border-width:10px; 20 border-color:#f00; 21 } 22 </style> 23 </head> 24 <body> 25 <div> 26 <span>html5+css3</span> 27 </div> 28 </body> 29 </html>