Rumah >hujung hadapan web >tutorial css >border-radius属性如何使用
border-radius属性如何使用
- 青灯夜游asal
- 2019-01-30 13:09:165750semak imbas
border-radius属性用于创建圆角，其使用语法是“border-radius: 1-4 length|%;”，border-radius是一个最多可指定四个“border -*- radius”属性的复合属性。
本文操作环境：Windows7系统、Dell G3电脑、HTML5&&CSS3版。
CSS3 border-radius属性
作用：border-radius 属性用于创建圆角
说明：border-radius 属性是一个最多可指定四个 border -*- radius 属性的复合属性。
基本语法：
border-radius: 1-4 length|% ;
注意: 每个半径的四个值的顺序是：左上角，右上角，右下角，左下角。如果省略左下角，右上角是相同的。如果省略右下角，左上角是相同的。如果省略右上角，左上角是相同的。
css3 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;
-moz-border-radius:25px; /* 老的 Firefox */
margin: 100px auto;
}
</style>
</head>
<body>
<div>border-radius 属性允许您向元素添加圆角。</div>
</body>
</html>效果图：
以上就是本篇文章的全部内容，希望能对大家的学习有所帮助。更多精彩内容大家可以关注php中文网相关教程栏目！！！
Atas ialah kandungan terperinci border-radius属性如何使用. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：nav-up属性如何使用Artikel seterusnya：box-shadow属性的功能是什么