Rumah >hujung hadapan web >tutorial css >Apakah sifat sempadan bulat bagi css3
Apakah sifat sempadan bulat bagi css3
- WBOYasal
- 2021-12-23 16:32:024408semak imbas
Atribut sempadan bulat css3 ialah "jejari sempadan". Atribut ini ialah atribut gabungan dengan sintaks "jejari sempadan:1-4 panjang|%;"; masing-masing gaya sempadan bulat untuk sudut kiri atas, kanan atas, kanan bawah dan kiri bawah.
Persekitaran pengendalian tutorial ini: sistem Windows 10, versi CSS3&&HTML5, komputer Dell G3.
Apakah atribut sempadan bulat bagi css3? Sifat jejari sempadan ialah sifat komposit yang boleh menentukan sehingga empat sifat jejari -*- sempadan.
Setiap nilai boleh dalam bentuk nilai berangka atau peratusan.
panjang/panjang Panjang pertama mewakili jejari dalam arah mendatar, dan yang kedua mewakili jejari dalam arah menegak.
Jika ia adalah nilai, maka empat nilai di kiri atas, kanan atas, kanan bawah dan kiri bawah adalah sama.
Jika terdapat dua nilai, maka kiri atas dan kanan bawah adalah sama dan merupakan nilai pertama, dan kanan atas dan kiri bawah adalah sama dan merupakan nilai kedua.
Jika terdapat tiga nilai, maka nilai pertama adalah untuk menetapkan atas-kiri, dan nilai kedua adalah atas-kanan dan bawah-kiri dan mereka akan sama, dan nilai ketiga adalah untuk menetapkan bawah- betul .
Jika terdapat empat nilai, maka nilai pertama adalah untuk menetapkan atas-kiri, dan nilai kedua untuk menetapkan atas-kanan, nilai ketiga untuk menetapkan bawah-kanan, dan nilai keempat adalah untuk set bawah-kiri
Selain singkatan di atas, anda juga boleh menulis empat penjuru secara berasingan seperti sempadan, seperti berikut:
Contohnya adalah seperti berikut:border-top-left-radius: //左上角 border-top-right-radius: //右上角 border-bottom-right-radius: //右下角 border-bottom-left-radius: //左下角
Hasil keluaran :
<html>
<head>
<meta charset="utf-8">
<title>123</title>
<style>
div
{
border:2px solid #a1a1a1;
padding:10px 40px;
background:#dddddd;
width:300px;
border-radius:25px;
}
</style>
</head>
<body>
<div>border-radius 属性允许您为元素添加圆角边框！ </div>
</body>
</html> (Belajar perkongsian video:
tutorial video css
)
Atas ialah kandungan terperinci Apakah sifat sempadan bulat bagi css3. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!