The border-boundaryharta di kekangan CSS set ke batas-batas unsur yang memberi kesan kepada bagaimana sempadan unsur bertindak. Ini ditentukan dalam spesifikasi Tahap 1 Paparan CSS, yang kini dalam status Draf Kerja. Itu bermaksud perkara boleh berubah antara sekarang dan cadangan calon rasmi.
.element ( border-boundary: display; /* sets the boundary to the screen display */ )Fakta bahawa harta tanah ini terdapat dalam spesifikasi Paparan Bulat CSS sudah memberitahu anda apa yang bagus: membuat antara muka bulat. Lebih khusus lagi, border-boundaryberada di bawah bahagian "Melukis sempadan di sekitar sempadan paparan" yang merupakan petunjuk lain untuk apa yang dilakukannya dengan baik: membiarkan sempadan elemen menghormati batas bulat antara muka bulat.
Bayangkan, jika anda mahu, jam tangan pintar dengan skrin bulat. Katakan bahawa skrin berukuran 150px persegi. Dan di dalamnya terdapat kotak oren yang mempunyai dimensi yang sama.
Tidak ada, gila, bukan? Kotak oren sesuai dengan paparan bulat kerana melimpah tepi, yang tersembunyi. Tetapi lihat apa yang berlaku apabila sempadan ditambahkan ke kotak ...
Hmm, tidak begitu hebat. Sekali lagi, bahagian tepi kotak melampaui paparan bulat, sehingga perbatasan kita terpotong dalam proses.
Di situlah border-boundarysesuai dengan gambar. Menambahnya ke kotak dengan nilai displaymembolehkan perbatasan kotak mengikuti bentuk bulat paparan. Oleh kerana sokongan penyemak imbas hartanah ini benar-benar zilch pada masa ini, izinkan saya untuk memberikan gambaran palsu hasil yang dimaksudkan.
Anda boleh membayangkan betapa bergunanya ini ketika merancang jam tangan dengan antara muka. Kumpulan Kerja CSS telah menyusun senarai kes penggunaan yang border-boundarymungkin sangat berguna.
Sintaks
border-boundary: none | parent | display;- Nilai awal:
none - Berlaku untuk: semua elemen
- Diwarisi: ya
- Peratusan: n / a
- Nilai dikira: seperti yang dinyatakan
- Jenis animasi: diskret
Nilai
none: tidak ada batas yang ditetapkan di sempadan.parent: menetapkan sempadan di mana kawasan elemen dan pinggir sempadan ibu bapa bertemu.display: menetapkan sempadan di mana kawasan elemen dan tepi sempadan bertemu.
Sokongan penyemak imbas
Tidak ada pada masa penulisan.
Bacaan lanjut
- Spesifikasi Tahap 1 Paparan CSS (Draf Kerja)
- Contoh Paparan Bulat (CSS Kumpulan Kerja Wiki)
- Spesifikasi Paparan Bulat CSS (01.org)