Dalam CSS3, anda boleh menggunakan atribut "jejari sempadan" untuk mencapai kesan sudut bulat Atribut ini digunakan untuk menetapkan sudut bulat sempadan luar elemen, dan atribut ini ialah atribut singkatan yang boleh. digunakan untuk menetapkan empat gaya sudut bulat yang berasingan, sintaksnya ialah "objek elemen {jejari sempadan: 1-4 panjang|% / 1-4 panjang|%;}".
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3&&HTML5, komputer Dell G3.
jejari sempadan membolehkan anda menetapkan sempadan luar elemen untuk dibundarkan. Menentukan bulatan apabila menggunakan satu jejari dan elips apabila menggunakan dua jejari. Persilangan bulatan (bujur) ini dan sempadan menghasilkan kesan sudut bulat.
Atribut jejari sempadan ialah atribut komposit yang boleh menentukan sehingga empat atribut jejari*-jidar
Sintaks
border-radius: 1-4 length|% / 1-4 length|%;
Nota : Susunan empat nilai bagi setiap jejari ialah: kiri atas, kanan atas, kanan bawah, kiri bawah. Jika sudut kiri bawah ditinggalkan, sudut kanan atas adalah sama. Jika sudut kanan bawah ditinggalkan, sudut kiri atas adalah sama. Jika penjuru kanan sebelah atas ditinggalkan, sudut kiri atas adalah sama.
panjang mentakrifkan bentuk lengkung.
% Gunakan % untuk menentukan bentuk bucu.
Contohnya seperti berikut:
<!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 */
}
</style>
</head>
<body>
<div>border-radius 属性允许您向元素添加圆角。</div>
</body>
</html>Hasil output:
(Pembelajaran perkongsian video: tutorial video css, tutorial video html)
Atas ialah kandungan terperinci Laksanakan kesan bucu bulat dalam css3. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
