CSS3 知识量：11 - 43 - 138
border-radius属性用于设置边框的圆角效果，在实际应用中很常见。其语法为：
border-radius:none|<length>{1,4}[/<length>{1,4}]?其中，如果反斜杠（/）及其后面的数值存在，“/”前面的值用于设置圆角水平方向的半径，“/”后面的值用于设置圆角垂直方向的半径。如果没有反斜杠，其水平和垂直方向的半径就是相同的。
元素具有4个角，设置的一般顺序是按照top-left、top-right、bottom-right、bottom-left进行的。具体使用时，会有4种情况：
设置1个length值：这时top-left、top-right、bottom-right、bottom-left的值相同，即4个圆角效果一样。
设置2个length值：这时元素左上角和右下角取第一个值，右上角和左下角取第二个值。
设置3个length值：这时第一个设置top-left，第二个值设置top-right和bottom-left，第三个值设置bottom-right。
设置4个length值：这时按照一般顺序设置4个角。
注意：设置为none时，表示元素没有圆角。length的值由浮点数和单位标识符组成，不能是负值。
每个圆角也可以单独设置，例如：
border-top-left-radius:4px;
下面是圆角边框属性的示例：
<!DOCTYPE html>
<html>
<head>
<title>边框</title>
<meta charset="UTF-8">
<style type="text/css">
p{
width: 300px;
height: 100px;
border: 5px solid #5fa134;
border-radius: 15px;
}
</style>
</head>
<body>
<h2>The Three Little Pigs</h2>
<p>Once upon a time there were three little pigs and the time came
for them to leave home and seek their fortunes.</p>
</body>
</html>显示的效果为：
Copyright © 2017-Now pnotes.cn. All Rights Reserved.
编程学习笔记 保留所有权利
MARK:3.0.0.20240214.P35
From 2017.2.6