Perbedaan Antara DIV dan SPAN

dan merupakan tag HTML yang mendefinisikan elemen dalam kode HTML.

HTML (Hypertext Markup Language) adalah kode terstruktur yang digunakan untuk membangun dan menampilkan halaman web yang kami kunjungi online, setiap hari, di perangkat apa pun.

Teknologi dan bahasa pemrograman lain dapat diintegrasikan dengan HTML untuk menyediakan fitur dinamis dan canggih di situs web.

Memahami HTML

Hyper Text Markup Language (HTML) adalah bahasa markup yang banyak digunakan dan mengacu pada struktur dan kode 'di belakang' halaman web, ditampilkan di browser web.

HTML adalah file teks menggunakan kode spesifik (sintaks) untuk menentukan gaya halaman, konten, tata letak, dan format. Itu Markup istilah menunjukkan teks / kode sedang dipersiapkan untuk diproses dan disajikan yaitu pada halaman web, di browser web.

World Wide Web Consortium (W3C) [i] mengakui HTML sebagai bahasa markup formal dalam pengembangan halaman web, dan oleh karena itu, HTML didukung oleh sebagian besar browser. Jadi, halaman web dapat dikembangkan dalam bahasa yang dikenal, mudah ditafsirkan oleh browser yang berbeda untuk membuat halaman seperti yang dimaksudkan oleh perancang.

Versi saat ini masih digunakan adalah HTML4, tetapi perlahan-lahan dihapus karena HTML5 mendapatkan lebih banyak dukungan dan adopsi untuk halaman web yang dinamis dan responsif.

Responsiveness menjadi komponen mendasar dalam pengembangan web untuk memberikan pengalaman pengguna yang lebih mudah dan lebih dinamis, yang harus diakomodasikan pada beberapa perangkat seperti smartphone, tablet, dan laptop.

Cascading Style Sheets (CSS) menjadi bagian integral untuk membangun halaman yang dinamis dan responsif. Ini adalah atribut pendefinisian file terpisah untuk setiap elemen seperti font, warna, perataan - sehingga pengembang tidak menunjukkan gaya elemen setiap kali digunakan dalam kode HTML.

Struktur Dasar HTML

Untuk memaksimalkan bahasa pengembangan apa pun, mematuhi struktur file standar dan mempertimbangkan penggunaan sintaksis terbaik adalah kunci dalam memberikan konten web yang stabil, terarah, dan menarik secara visual..

Halaman HTML memiliki struktur yang ditentukan oleh elemen (juga disebut sebagai tag). Saat menulis kode HTML, elemen-elemen ini ditampilkan berpasangan - itu artinya, setiap tag membutuhkan pembukaan dan penutupan. Awal dan akhir.

Elemen dibuka dengan sintaks: dan ditutup dengan.  Itu / garis miring menunjukkan akhir definisi elemen itu.

Atribut elemen dan konten didefinisikan antara dua titik tersebut.

Itu elemen minimum diperlukan untuk file HTML adalah definisi,, (hanya HTML4), dan tag.

  • Definisi DOCTYPE

Definisi (DTD) pertama-tama harus dinyatakan sebagai tag pertama dalam file HTML, jadi ketika halaman diproses, browser web tahu jenis file apa itu, dan oleh karena itu dapat dengan benar menafsirkan dan menampilkan halaman.

Dalam HTML4, ada variasi DTD (tergantung pada atribut dan elemen halaman) tetapi pernyataan yang lebih umum akan dimasukkan sebagai:

atau

DTD dalam HTML5 jauh lebih sederhana:

· HTML, KEPALA, dan BODY

  • Tag menunjukkan itu adalah file HTML dan ini adalah akar dari elemen HTML yang berisi semua elemen berikutnya yang didefinisikan di dalamnya; dan termasuk atribut bahasa direkomendasikan sebagai praktik terbaik; sebagai contoh:
  • Diperlukan dalam HTML4, tetapi tidak wajib dalam HTML5. Ini adalah elemen yang mengandung elemen lain yang relevan dengan bagian dokumen ini, seperti judul, skrip referensi, mendefinisikan gaya dan metadata. Tag tertutup harus digunakan sebelum mendefinisikan 
  • Elemen tersebut menyimpan konten utama untuk halaman, termasuk tabel, teks gambar, daftar dll. Setelah tag ditutup, elemen sekarang dapat berakhir. Menggunakan elemen HTML5 baru adalah opsional untuk halaman atau bagian lain dari konten.

Elemen HTML

HTML5 telah menghasilkan elemen-elemen baru untuk kemudahan pengembangan dan desain, dan juga menghilangkan elemen-elemen yang digunakan dalam HTML4. Daftar perbedaan antara HTML4 dan HTML5 diterbitkan oleh World Wide Web Consortium (W3C) [ii].

HTML DIV TAG

Seiring dengan peningkatan, dan elemen baru, dikombinasikan dengan kemajuan CSS, elemen tertentu dapat digunakan dengan cara yang berbeda dan lebih baik dari sebelumnya, dan halaman web menjadi lebih cepat, lebih kaya fitur dan indah untuk dilihat! dengan CSS, digunakan dengan HTML5 dapat menggantikan elemen tertentu yang terlalu sering digunakan, seperti .

Tag ini populer saat memisahkan konten pada halaman. Saat membuat elemen ini, ia secara otomatis menyisipkan jeda
untuk menyatukan teks atau konten, alih-alih teks yang melintasi halaman.

Dengan aksesibilitas situs web dan optimisasi mesin pencari, teknik menjadi sangat ilmiah dan direkomendasikan oleh WC3 untuk tidak selalu kembali menggunakan dalam HTML5.

Sebagai contoh untuk format blog yang terstruktur dengan rapi tetapi sederhana, pertimbangkan elemen HTML5 baru dengan CSS daripada menggunakan elemen; gunakan elemen untuk konten utama, elemen untuk menyorot atau memisahkan konten apa pun pada halaman, header, atau footer (di mana saja!) dan elemen tersebut dapat digunakan untuk menahan menu atau tautan grup untuk menelusuri dari halaman.

Elemen-elemen baru ini dengan mudah mengidentifikasi tipe konten menggunakan HTML5. Namun, tag ini juga digunakan dengan CSS untuk membuat situs web responsif.

Membuat setiap elemen (dengan id atau kelasnya sendiri), file CSS dapat didefinisikan untuk memanipulasi setiap elemen.

Contoh HTML di bawah ini menunjukkan contoh penggunaan beberapa elemen:

Contoh saya

Elemen dapat memiliki atribut yang berbeda, khususnya ukuran yang berbeda untuk interaksi responsif tergantung pada ukuran layar perangkat yang digunakan.

Berikut ini adalah contoh bagaimana setiap elemen dapat ditata dalam file CSS HTML yang sesuai - dengan mereferensikan setiap tag.

#Header

lebar: 800px;

tinggi: otomatis

margin-left: auto;

margin-left: auto;

#Featured

tinggi: 150px;

Warna latar: #CCC;

TAG SPAN HTML

Elemen adalah elemen inline dan tidak memecah menjadi garis-garis kecuali istirahat
tag digunakan dan teks (konten) yang ditentukan antara tag buka dan tutup ditampilkan sebagai garis (secara default tanpa menggunakan elemen lain).

Elemen sebaris adalah elemen teks dalam file HTML dan dapat didefinisikan dalam baris elemen lain.

Seperti, elemen tidak memiliki berarti untuk referensi yang optimal. Ini pada dasarnya menunjukkan konten elemen apa adanya, tetapi semua contoh dapat didefinisikan dalam CSS untuk gaya jika ditandai dengan benar dan diperkaya dengan atribut lain, atau dimanipulasi dengan JavaScript.

Dalam contoh di bawah ini, teks biru menyoroti bagaimana elemen span dapat bersarang sebagai elemen inline dengan atribut yang berbeda dari elemen induknya - paragraf p>:

Untuk membuka contoh, klik pada ikon di bagian bawah halaman.

Ketika dilihat di peramban web, teks pada elemen di atas akan ditampilkan dalam font yang berbeda dengan paragraf untuk menekankan di mana pengguna harus mengklik untuk mengakses contoh.

Perhatikan tidak ada perbedaan antara HTML4 dan HTML5.