CSS3边框:通过CSS3,您能够创建圆角边框,向矩形添加阴影,使用图片来绘制边框-并且不需使用设计软件,比如PhotoShop
属性:border-radius,box-shadow,border-image
浏览器支持:Internet, Explorer9+支持border-radius和box-shadow属性。
Firefox、Chrome以及Safari支持所有新的边框属性。
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .div1,.div2{ width: 100px; height: 100px; line-height: 100px; border: 1px solid #f00; text-align: center; color: #fff; } .div1{ border-radius: 20px; -moz-border-radius:20px; -ms-border-radius:20px; -webkit--border-radius:20px; } .div2{ margin-top: 50px; background-color: #00f; box-shadow: 10px 10px 10px orangered; } </style> </head> <body> <div class="div1">圆角效果</div> <div class="div2">阴影效果</div> </body> </html>