Bagian kepala dari dokumen HTML biasanya menyertakan judul halaman yang ditunjuk, yang memberikan informasi tentang halaman itu sendiri, memuat tabel gaya, dan memuat file JavaScript (untuk pertimbangan kinerja, sebagian besar waktu ditempatkan di bagian bawah halaman < /body> muat sebelum akhir label berakhir JavaScript). Kecuali untuk judul, konten di kepala tidak terlihat oleh pengunjung halaman.
Berikut ini adalah contoh bagian kepala dari dokumen HTML:
<head> <meta charset = utf-8/> <meta name = konten penulis = adam freeman/> <itement> judul halaman Anda </iteme> <base href = http: // titings/target = _ blank/> < Tipe Gaya = Teks/CSS> A {latar belakang: Grey; Elemen judulElemen kepala harus berisi elemen judul, yang akan muncul di tab browser atau bagian atas jendela browser, sebagai judul halaman web dan terkait dengan browser.
elemen dasarElemen dasar digunakan untuk mengatur URL benchmark untuk menganalisis tautan relatif dalam dokumen HTML berdasarkan ini. Jika tidak ditentukan, gunakan URL dari dokumen pemuatan saat ini. Elemen dasar juga dapat mengatur cara untuk membuka tautan saat pengguna mengklik, dan bagaimana browser bereaksi saat mengirimkan formulir.
<base href = http: // bjpowernode/listing/target = _blank/>
1) HREF adalah URL tolok ukur yang ditentukan.
2) Di mana harus membuka semua tautan di halaman, termasuk di mana atribut target dibuka, termasuk nilainya:
1) _Blank: Buka dokumen yang terhubung di jendela baru;
2) _Self: Secara default, buka dokumen tautan dalam kerangka yang sama;
3) _parent: Buka dokumen yang ditautkan dalam bingkai induk;
4) _top: Buka dokumen tautan di seluruh jendela;
5) Nama Framen: Buka dokumen tautan dalam kerangka kerja yang ditentukan.
Elemen metaElemen meta digunakan untuk mendefinisikan berbagai metadata dokumentasi. Elemen kepala.
Tentukan pasangan metadata nama/nilai<meta name = konten penulis = Adam Freeman/>
Atribut nama digunakan untuk mewakili jenis metadata, yang memberikan nilai atribut konten. Atribut nama berisi nilai -nilai berikut:
1) Nama Aplikasi: Nama sistem aplikasi web milik halaman saat ini;
2) Penulis: Nama penulis halaman saat ini;
3) Deskripsi: Instruksi halaman saat ini;
4) Generator: Nama perangkat lunak yang digunakan untuk menghasilkan HTML;
5) Kata kunci: Jelaskan konten halaman.
Selain lima nama metadata yang telah ditentukan sebelumnya, Anda juga dapat menggunakan ekspansi metadata. Beberapa ekstensi digunakan lebih banyak, seperti robot metadata.
<meta name = robot konten = noindex/>
Atribut ini memiliki nilai -nilai yang diakui sebagian besar mesin pencari:
1) Nondex: Jangan mengindeks halaman ini;
2) noarchive: jangan mengarsipkan atau menyimpan halaman ini;
3) Nofollow: Jangan lanjutkan mencari di sepanjang tautan di halaman ini.
Sebagian besar mesin pencari memberikan pedoman untuk mengoptimalkan halaman web atau seluruh situs web, dan Anda dapat melihat halaman web atau pedoman optimasi situs web yang disediakan oleh mesin pencari yang sesuai.
Kode Karakter Deklarasi<meta charset = UTF-8 />
Pengkodean karakter dokumen deklarasi elemen meta di elemen kepala adalah UTF-8 (default).
Simulasi bidang header httpElemen meta dapat digunakan untuk mensimulasikan atau mengganti nilai tiga bidang header HTTP.
<meta http-equiv = refresh content = 5/>
Penggunaan atribut HTTP-equiV adalah nama nama bidang header yang menentukan header yang disimulasikan, dan nilai bidang ditentukan dalam properti konten. Nilai opsional dari properti HTTP-equiV adalah sebagai berikut:
1) Refresh: Tentukan interval waktu dalam detik dalam detik. Anda juga dapat menentukan URL secara terpisah untuk dimuat oleh browser, seperti:
<meta http-equiv = refressh konten = 5;
2) gaya default: Tentukan tabel gaya yang lebih disukai oleh halaman.
3) tipe konten: Metode lain untuk mendeklarasikan pengkodean karakter yang digunakan di halaman HTML, seperti ::
<meta http-equiv = konten konten konten = teks/html charset = utf-8/>Elemen gaya
Tentukan gaya CSS yang tertanam dalam dokumen HTML.
<Tipe Gaya = Teks/CSS> A {Latar Belakang: Grey;Gaya baru dirancang untuk elemen A. Elemen gaya dapat muncul di berbagai bagian dokumen HTML.
Media yang dapat menentukan gaya untuk elemen gaya:
<Media gaya = layar dan (min-lebar: 500px) type = text/css> ...... </tyle>
Layar di atribut media adalah jenis perangkat, dan kisaran nilai opsional meliputi:
1) semua: Gunakan gaya untuk semua perangkat (nilai default);
2) aural: Gunakan gaya untuk synthesizer suara;
3) Braille: Gunakan gaya untuk menanyakan perangkat;
4) genggam: Gunakan gaya untuk perangkat genggam;
5) Proyek: Gunakan gaya untuk proyektor;
6) Cetak: Saat menggunakan gaya pratinjau dan cetak gaya;
7) Layar: Gunakan gaya untuk layar tampilan komputer;
8) TTY: Gunakan gaya untuk peralatan lebar yang sama seperti mesin yang lewat listrik;
9) TV: Gunakan gaya untuk TV.
(Min-lebar: 500px) Fitur yang ditentukan dalam atribusi media, termasuk:
1) Tinggi Lebar: Tentukan lebar dan tinggi jendela browser, unit PX, misalnya: Lebar: 200px
2) Perangkat Perangkat lebar-tinggi: Tentukan lebar dan tinggi seluruh perangkat (bukan hanya jendela browser), unit px, misalnya: Min-Device-Height: 200px
3) Resolusi: Kepadatan piksel perangkat, unit dpi (titik/inci) atau dpcm (titik/cm), misalnya: resolusi maks: 600dpi
4) Orientasi: Arah panjang -besar dari perangkat yang ditentukan, nilai opsionalnya adalah potret dan lanskap
5) Aspek -Ratio Perangkat-Aspect-Ratio: Tentukan rasio lebar piksel dari jendela browser atau seluruh perangkat, misalnya: Min-aspect-ratio: 16/9
6) Warna Monokrom: Tentukan digit biner yang ditempati oleh setiap piksel pada setiap piksel pada warna atau perangkat hitam dan putih, misalnya: Min-monokrom: 2
7) Indeks-warna: Jumlah warna yang dapat ditampilkan oleh perangkat yang ditunjuk, misalnya: Max-Color-IDEX: 256
8) Pemindaian: Tentukan mode pemindaian TV, termasuk nilai progresif dan interlasi
9) Grid: Jenis perangkat yang ditentukan, nilai dukungan adalah 0 dan 1 (1 mewakili perangkat tipe kisi, menggunakan konten tampilan grid tetap)
Elemen tautanIni digunakan untuk membangun hubungan antara dokumen HTML dan sumber daya eksternal (seperti tabel gaya CSS). Elemen tautan berisi 6 atribut lokal, sebagai berikut:
1) href: Tentukan URL sumber daya yang menunjuk ke elemen tautan;
2) hreflang: jelaskan bahasa yang digunakan dalam sumber daya terkait;
3) Media: Jelaskan perangkat mana yang digunakan dalam konten terkait, dan atribut media dalam gaya;
4) REL: Kisaran hubungan antara dokumen dan sumber daya terkait adalah sebagai berikut:
--- Alternatif: Versi alternatif tautan ke dokumen, seperti terjemahan bahasa lain;
--- Penulis: Penulis tautan ke dokumen;
--- BANTUAN: Dokumen deskripsi yang terhubung ke dokumen saat ini;
--- Ikon: Tentukan Sumber Daya Ikon;
--- Lisensi: Tautan ke lisensi yang relevan ke dokumen saat ini;
--- Pingback: Tentukan server pingback, yang dapat secara otomatis diberitahu saat menautkan dari situs web lain ke blog;
--- Prefetch: Dapatkan sumber daya terlebih dahulu;
--- Stylesheet: Muat tabel gaya eksternal.
5) Ukuran: Tentukan ukuran ikon;
6) Ketik: Tentukan tipe MIME dari sumber daya terkait, seperti teks/CSS, gambar/x-icon.
Muat tabel gaya eksternal<tautan rel = stylesheet type = text/css href = styles.css/>
Anda dapat menggunakan beberapa elemen tautan untuk memuat beberapa sumber daya eksternal.
Tentukan logo situs web untuk halaman tersebut<tautan rel = ikon pintas href = favicon.ico type = gambar /x-icon />
Ketika browser dimuat dengan halaman HTML, itu akan memuat dan menampilkan logo situs web.
Catatan: Jika file logo situs web terletak di /favicon.ico (direktori root server web), tidak perlu menggunakan elemen tautan. tidak ada elemen tautan.
Sumber Daya Pra -Bahan
Browser dapat diminta untuk mendapatkan sumber daya yang diharapkan akan segera digunakan.
<tautan rel = prefetch href =/page2.html/>
Catatan: Tidak semua browser saat ini mendukung fungsi ini.
Elemen skripDigunakan untuk menambahkan skrip pada halaman, Anda dapat menentukan skrip dan merujuk skrip dalam dokumen secara langsung. Atribut lokal yang didukung oleh elemen ini adalah sebagai berikut:
1) Ketik: Jenis skrip yang dirujuk atau ditentukan, untuk atribut skrip JavaScript, dapat menghilangkan
2) SRC: Tentukan URL file skrip eksternal
3) Tunda Async (HTML5 Penambahan Baru): Atur metode eksekusi skrip, kedua atribut ini hanya dapat digunakan dengan atribut SRC
4) Charset: Jelaskan pengkodean karakter yang digunakan dalam file skrip eksternal, yang hanya dapat digunakan dengan atribut SRC
Tentukan dokumen dalam skrip tertanam<script> document.write (ini dari skrip); </script>
Secara default, browser akan dieksekusi segera setelah skrip menemukan halaman.
Muat pustaka skrip eksternalAnda dapat memasukkan skrip ke dalam file terpisah, dan kemudian memuat dokumen HTML dengan elemen skrip.
<Script src = Simple.js> </script>Menghabiskan eksekusi skrip
Gunakan atribut async dan tundukan untuk mengontrol metode eksekusi skrip.
<Script Dist Src = Simple2.js> </script>
Karena HTML akan dieksekusi saat menemukan skrip, jika skrip Anda perlu menggunakan konten dalam skrip HTML, Anda biasanya perlu memasukkan skrip ke dalam skrip HTML yang sesuai, tetapi dalam HTML5, tujuan yang sama dapat dicapai dengan penundaan milik.
Ketika browser menemukan elemen skrip, perilaku default adalah menangguhkan halaman pemrosesan saat memuat dan mengeksekusi skrip, dan setiap elemen skrip dieksekusi secara bergantian. Atribut async dapat menjadi naskah pemuatan dan pelaksanaan asinkron selama browser yang parsing dokumen HTML.
<Script async src = Simple2.js> </script>elemen noscript
Elemen noscript digunakan untuk menampilkan beberapa konten kepada pengguna yang menonaktifkan JavaScript atau browser tidak mendukung JavaScript.
<noscript> <h1> JavaScript diperlukan!
Pilihan lain adalah memimpinnya ke URL lain ketika browser tidak mendukung JavaScript.
<noscript> <meta http-equiv = refresh content = 0;