5.1 Atribut style dari sebuah tag
Dan beberapa hal berguna lainnya tentang HTML. Ketika web mulai mendapatkan popularitas, ada permintaan yang meningkat untuk halaman web yang dirancang dengan indah atau sangat indah. Masalah ini diselesaikan dengan menggunakan . style
Bentuk umum atribut ini memiliki format sebagai berikut:
<tag style="name=value;name2=value2;nameN=valueN">Nilai atribut, dipisahkan styledengan titik koma, mencantumkan semua "gaya" yang perlu diterapkan ke tag.
Katakanlah Anda ingin menampilkan gambar sebagai persegi 100*100dan membuatnya setengah transparan. Untuk melakukan ini, Anda perlu menambahkan gaya khusus ke dalamnya:
- lebar=100px;
- tinggi=100px;
- opasitas = 0,5;
Maka kode HTML dengan gambar ini akan terlihat seperti ini:
<img src="logo.png" style="width=100px;height=100px;opacity=0.5">Ada ratusan, bahkan ribuan, gaya. Dan pengembang browser terus-menerus membuat yang baru. Ada baiknya Anda belajar menjadi pengembang Java, bukan perancang web :)
5.2 Gaya CSS Populer
Kecil kemungkinan Anda akan menulis banyak kode HTML atau mengedit gayanya dalam hidup Anda, tetapi apa pun bisa terjadi. Misalnya, Anda sedang menulis beberapa halaman HTML kecil untuk menguji API. Oleh karena itu, mengetahui gaya dasar HTMLdapat membantu.
Di bawah ini adalah 10 yang paling umum untuk pengembang backend:
| # | Nama | Contoh | Keterangan |
|---|---|---|---|
| 1 | lebar | lebar: 100px | lebar elemen dalam piksel |
| 2 | tinggi | tinggi: 50% | tinggi elemen sebagai persentase (dari lebar induk) |
| 3 | menampilkan | tampilan: tidak ada | elemen tampilan (jangan tampilkan elemen) |
| 4 | visibilitas | visibilitas: tersembunyi | visibilitas elemen (elemen disembunyikan, tetapi ruang dicadangkan untuknya) |
| 5 | warna | warna merah; | warna teks |
| 6 | warna latar belakang | warna latar belakang: asap | warna latar belakang |
| 7 | berbatasan | batas: 1px hitam pekat; | perbatasan (lebar 1px, warna hitam, garis padat) |
| 8 | font | jenis huruf: verdana 10pt | font: verdana, ukuran 10pt |
| 9 | perataan teks | perataan teks: tengah; | perataan teks secara horizontal |
| 10 | batas | margin:2px | padding di luar elemen |
Anda tidak perlu mengingat tag ini, semuanya ada di Internet. Selain itu, setiap "gaya" memiliki kumpulan nilai validnya sendiri dan formatnya sendiri untuk mendeskripsikan nilainya. Lihatlah setidaknya borderatau font.