Rumah >hujung hadapan web >tutorial css >Cara menggunakan outline dalam css
Sifat
outline digunakan dalam CSS untuk membuat sempadan di sekeliling elemen untuk menyerlahkan fokus atau status. Ia berbeza daripada harta sempadan kerana ia tidak mengambil ruang pada elemen, dipaparkan secara automatik apabila elemen mendapat fokus, dan warna serta gaya boleh ditetapkan secara bebas. Sintaksnya adalah seperti berikut: garis besar:
;
Penggunaan garis besar dalam CSS
Sifat outline
digunakan dalam CSS untuk membuat sempadan di sekeliling elemen, menyerlahkan fokus atau keadaannya. Ia serupa dengan atribut border
, tetapi mempunyai beberapa perbezaan penting: outline
属性在 CSS 中用于在元素周围创建一条边框,突出显示其焦点或状态。它与 border
属性相似,但有一些重要区别:
区别于 border
属性
outline
不会占用元素空间,仅为视觉效果。outline
在元素 фокус 时自动显示,而 border
始终可见。outline
的颜色和样式可以独立设置,而 border
的颜色和样式通常与元素本身的样式相同。语法
outline
属性的语法如下:
<code>outline: <color> <style> <width>;</code>
其中,
color
指定 outline 的颜色。style
指定 outline 的线型样式(例如,dotted、dashed、solid)。width
指定 outline 的宽度。用法
outline
属性可以用以下方式应用:
outline
属性来使其脱颖而出。outline
来表明它正在被编辑。outline
在元素周围创建视觉分隔符,使其在页面中更加显眼。outline
来查看元素的边界,以帮助识别重叠或间距问题。示例
以下示例显示如何使用 outline
属性突出显示一个选中的按钮:
<code class="css">button:focus { outline: 2px solid red; }</code>
当按钮获得焦点时,它将显示一个 2 像素宽的红色 outline
border
🎜🎜outline is not Ia akan mengambil ruang elemen dan hanya untuk kesan visual.
garis besar
dipaparkan secara automatik apabila elemen adalah фокус, manakala sempadan
sentiasa kelihatan. garis besar
boleh ditetapkan secara berasingan, manakala warna dan gaya sempadan
biasanya sama dengan gaya elemen itu sendiri . gaya
Menentukan gaya garis garis besar (contohnya, bertitik, putus-putus, pepejal). lebar
Menentukan lebar garis besar. outline
untuknya. garis besar
buat sementara waktu untuk melihat sempadan elemen untuk membantu mengenal pasti isu pertindihan atau jarak. outline
: 🎜rrreee🎜Apabila butang mendapat fokus, ia akan memaparkan 2 piksel Atas ialah kandungan terperinci Cara menggunakan outline dalam css. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!