Cara Menggambar Tanda Centang/Centang Menggunakan CSS

elemen kontainer ” dengan “ pengenal ” atau “ kelas ”:

< div pengenal = 'Tanda cek' >< / div >

Dalam pernyataan HTML di atas, sebuah “ div ” elemen telah ditambahkan dengan id yang dideklarasikan sebagai “ Tanda cek ”.

Saat menata elemen menggunakan properti CSS, tambahkan “ pengenal ” pemilih untuk merujuk ke elemen HTML dan kemudian menentukan properti di dalamnya:

---

---

#Tanda cek
{
mengubah: memutar ( 45 derajat ) ;
tinggi : 45px;
lebar : 20px;
margin-kiri: lima puluh %;
border-bottom: 9px solid darkolivegreen;
border-right: 9px solid darkolivegreen;
}

Elemen gaya CSS di atas memiliki properti berikut:

• “ transformasi: putar (45 derajat) ” memutar garis lurus vertikal dan horizontal sedemikian rupa sehingga membentuk simbol centang.
• “ tinggi Properti ” mengatur ketinggian simbol centang menjadi “ 45px ”.
• “ lebar ” properti membuat simbol “ 20px ' lebar.
• “ margin-kiri ” properti menyelaraskan simbol centang ke tengah antarmuka halaman web.
• Setelah itu, “ perbatasan-bawah ' Dan ' perbatasan-kanan ”properti mengatur bobot batas kedua garis menjadi“ 9px ” dan tentukan “ darkolivegreen ” warna untuk kedua garis yang membuat simbol centang lengkap.

Ini akan membuat tanda centang sederhana berwarna hijau atau simbol centang yang ditampilkan di tengah antarmuka halaman web ' 45px 'tinggi dan' 20px ' lebar:

Metode 2: Memasukkan Tanda Centang/Centang Menggunakan Karakter Unicode

Ada juga beberapa karakter Unicode yang secara otomatis menyisipkan simbol tanda centang di keluaran tanpa perlu mengatur gaya dan menentukan nilai parameter untuknya. Misalnya, karakter Unicode “ U+2713 ” membantu menambahkan simbol centang sederhana di keluaran. Demikian pula, karakter Unicode “ U+2713 ” membantu menyisipkan simbol centang berat putih di keluaran. Untuk mempelajari cara menambahkan karakter Unicode ini ke dalam dokumen HTML melalui panduan lengkap, klik Di Sini .

Kesimpulan

Tanda centang atau simbol centang dapat digambar dengan terlebih dahulu membuat elemen HTML dengan id atau kelas, lalu menambahkan pemilih id atau kelas dalam elemen gaya CSS untuk merujuk ke elemen tersebut. Untuk membuat bentuk tanda centang/centang pada antarmuka halaman web, properti CSS yang berbeda seperti “ tinggi ”, “ lebar ”, “ memutar ' Dan ' warna ” dapat digunakan sesuai dengan jenis dan ukuran tanda centang yang diinginkan. Blog ini mendemonstrasikan cara menggambar tanda centang/centang menggunakan CSS.