css3学习01
1.圆角边框（div的一个属性：border-radius）
<!DOCTYPE html>
<html>
<head>
<style>
div
{
text-align:center;
border:2px solid #a1a1a1;
padding:10px 40px;
background:#dddddd;
width:350px;
border-radius:25px;
}
</style>
</head>
<body>
<div>有圆角的div</div>
</body>
</html>
效果图：
2.边框阴影（box-shadow）
<!DOCTYPE html>
<html>
<head>
<style>
div
{
width:300px;
height:100px;
background-color:blue;
box-shadow: 15px 15px 30px red;
}
</style>
</head>
<body>
<div></div>
</body>
</html>
效果图：
box-shadow：
水平阴影、垂直阴影、模糊距离，以及阴影的颜色
第一个参数--水平阴影，向右移动距离
第二个参数--垂直阴影，向下移动距离
第三个参数--模糊距离，把阴影拉远、变模糊
第四个参数--阴影颜色
本文出自wentaokyle，转载请标明出处！谢谢！
浙公网安备 33010602011771号