<!DOCTYPE html>
<!--
作者:1357751126@qq.com
时间:2014-09-19
描述:
>>>>
#.X{
在有边框的条件下设置半径:
border-radius: ; --半径属性
}
-->
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
#circle1{
margin-top: 20px;
width: 50px;
height: 50px;
border: 1px solid blue;
border-radius: 25px; /*此元素属性设置半径--改变其值,观察变化*/
}
#circle2{
margin-top: 20px;
width: 50px;
height: 50px;
border: 1px solid blue;
-border-radius: 15px;
}
#circle3{
margin-top: 20px;
width: 150px;
height: 50px;
border: 1px solid blue;
-border-radius: 15px;
}
</style>
</head>
<body>
<div id="circle1"></div>
<div id="circle2"></div>
<div id="circle3"></div>
</body>
</html>
<!--
作者:1357751126@qq.com
时间:2014-09-19
描述:
>>>>
#.X{
在有边框的条件下设置半径:
border-radius: ; --半径属性
}
-->
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css">
#circle1{
margin-top: 20px;
width: 50px;
height: 50px;
border: 1px solid blue;
border-radius: 25px; /*此元素属性设置半径--改变其值,观察变化*/
}
#circle2{
margin-top: 20px;
width: 50px;
height: 50px;
border: 1px solid blue;
-border-radius: 15px;
}
#circle3{
margin-top: 20px;
width: 150px;
height: 50px;
border: 1px solid blue;
-border-radius: 15px;
}
</style>
</head>
<body>
<div id="circle1"></div>
<div id="circle2"></div>
<div id="circle3"></div>
</body>
</html>