Gunakan span dan div dengan CSS untuk kontrol gaya dan tata letak yang lebih besar.
Banyak orang yang baru mengenal desain web dan HTML / CSS menggunakan elemen dan Elemen div mendefinisikan pembagian logis di halaman web Anda. Ini pada dasarnya adalah kotak di mana Anda dapat menempatkan elemen HTML lainnya yang secara logis berjalan bersama. Sebuah divisi dapat memiliki beberapa elemen lain di dalamnya, seperti paragraf, judul, daftar, tautan, gambar, dll. Bahkan dapat memiliki divisi lain di dalamnya untuk menyediakan struktur dan organisasi tambahan ke dokumen HTML Anda. Untuk menggunakan elemen div, tempatkan tag isi div div> Jika area halaman Anda membutuhkan beberapa informasi tambahan yang akan Anda gunakan untuk gaya dengan CSS nanti, Anda dapat menambahkan pemilih id (misalnya, id = "myDiv">), atau pemilih kelas (mis., class = "bigDiv">). Kedua atribut ini kemudian dapat dipilih menggunakan CSS atau dimodifikasi menggunakan JavaScript. Praktik terbaik saat ini cenderung menggunakan pemilih kelas alih-alih ID, sebagian karena cara pemilih ID khusus. Sebenarnya, Anda bisa menggunakan salah satunya dan bahkan dapat memberikan pembagian ID dan pemilih kelas. Kapan Harus Menggunakan Elemen div berbeda dari elemen bagian HTML5 karena elemen ini tidak memberikan konten semantik apa pun. Jika Anda tidak yakin apakah blok konten harus berupa div atau bagian, pikirkan tentang apa tujuan elemen dan konten tersebut untuk membantu Anda memutuskan yang mana yang akan digunakan: Pada akhirnya, kedua div dan bagian berperilaku sangat mirip dan Anda dapat memberikan salah satu dari mereka nilai atribut dan gaya mereka dengan CSS untuk mendapatkan tampilan situs Anda yang Anda butuhkan. Keduanya merupakan elemen level blok. Elemen span adalah elemen inline secara default. Ini membedakannya dari elemen div dan bagian. Elemen rentang sering digunakan untuk membungkus konten tertentu, biasanya teks, untuk memberinya tambahan "hook" yang dapat ditata nanti. Digunakan dengan CSS, dapat mengubah gaya teks yang dilampirkan; Namun, tanpa atribut gaya, elemen span saja tidak berpengaruh pada teks sama sekali. Ini adalah perbedaan utama antara rentang dan elemen div. Seperti yang disebutkan di atas, elemen div mencakup pemisahan paragraf, sedangkan elemen span hanya memberi tahu browser untuk menerapkan aturan gaya CSS terkait ke apa yang diapit oleh tag : Teks yang disorot span> dan teks yang tidak disorot. p> Tambahkan class = "highlight" atau kelas lain ke elemen span untuk menata teks dengan CSS (mis., Class = "highlight">). Elemen span tidak memiliki atribut yang diperlukan, tetapi tiga yang paling berguna adalah sama dengan elemen div: Gunakan rentang saat Anda ingin mengubah gaya konten tanpa mendefinisikan konten sebagai elemen tingkat blok baru dalam dokumen. Misalnya, jika Anda ingin kata kedua dari judul h3 menjadi merah, Anda bisa mengelilingi kata itu dengan elemen rentang yang akan menata kata itu sebagai teks merah. Kata masih menjadi bagian dari elemen h3, tetapi sekarang juga ditampilkan dalam warna merah: Diedit oleh Jeremy Girard pada 2/2/17 Menggunakan Elemen
Menggunakan Elemen
div> Ini adalah My Awesome Headline