Terdapat banyak teg dan elemen dalam bahagian kepala HTML, yang melibatkan pemaparan penyemak imbas halaman web, SEO, dsb. Setiap teras penyemak imbas dan setiap pengeluar penyemak imbas domestik mempunyai elemen teg mereka sendiri, yang menghasilkan banyak perbezaan. Dalam era Internet mudah alih, struktur kepala dan elemen meta terminal mudah alih adalah lebih penting. Memahami maksud setiap teg dan menulis teg kepala yang memenuhi keperluan anda sendiri ialah tujuan artikel ini. Artikel ini adalah berdasarkan artikel Yishi dan menyediakan ringkasan yang diperluaskan untuk memperkenalkan maksud dan senario penggunaan setiap teg dan elemen dalam kepala yang biasa digunakan.
DOCTYPE
DOCTYPE (Jenis Dokumen), pengisytiharan ini terletak di kedudukan paling hadapan dalam dokumen, sebelum teg html ini memberitahu pelayar jenis apa HTML yang digunakan oleh dokumen Atau spesifikasi XHTML.
Pengisytiharan DTD (Definisi Jenis Dokumen) bermula dengan , tidak sensitif huruf besar dan tidak mempunyai kandungan di hadapan Jika terdapat kandungan lain (kecuali ruang), penyemak imbas akan membuka pelik mod di bawah IE ( mod quirks) menjadikan halaman web. DTD awam, format nama adalah pendaftaran // organisasi // tag jenis // bahasa, pendaftaran merujuk kepada sama ada organisasi itu didaftarkan oleh Pertubuhan Standardisasi Antarabangsa (ISO), menunjukkan ya, - menunjukkan tidak. Organisasi ialah nama organisasi, seperti: W3C. Jenisnya biasanya DTD. Teg menentukan perihalan teks awam, iaitu nama deskriptif unik untuk teks awam yang dirujuk, yang boleh diikuti dengan nombor versi. Bahasa terakhir ialah pengecam bahasa ISO 639 bagi bahasa DTD, seperti: EN untuk bahasa Inggeris, ZH untuk bahasa Cina. XHTML 1.0 boleh mengisytiharkan tiga jenis DTD. Mewakili versi ketat, versi peralihan dan dokumen HTML berasaskan bingkai masing-masing.
●HTML 4.01 ketat
Doctype mempunyai dua tujuan utama dalam HTML.
●Sahkan kesahihan dokumen.
Ia memberitahu ejen pengguna dan pengesah apa DTD dokumen ini ditulis mengikut. Tindakan ini adalah pasif. Setiap kali halaman dimuatkan, penyemak imbas tidak memuat turun DTD dan menyemak kesahihan ia hanya didayakan apabila halaman disahkan secara manual.
●Tentukan mod pemaparan penyemak imbas
Untuk operasi sebenar, maklumkan penyemak imbas algoritma penghuraian yang hendak digunakan semasa membaca dokumen. Jika ia tidak ditulis, penyemak imbas akan menghuraikan kod mengikut peraturannya sendiri, yang boleh menjejaskan reka letak html secara serius. Pelayar mempunyai tiga cara untuk menghuraikan dokumen HTML.
●Mod bukan pelik (standard)
●Mod pelik
●Mod separa pelik (hampir standard) Mengenai mod dokumen pelayar IE, mod penyemak imbas, mod ketat, mod aneh, tag DOCTYPE, anda boleh mengetahui lebih lanjut Mod membaca? standard! kandungan.
set aksara
Isytiharkan pengekodan aksara yang digunakan oleh dokumen,
Sebelum html5, halaman web akan berbunyi seperti ini:
Kedua-dua ini bersamaan, sila baca butiran di bawah: vs , jadi ia disyorkan untuk menggunakan yang lebih pendek yang lebih mudah diingati.
atribut lang
Bahasa Cina Ringkas
Cina Tradisional
Mengapa lang="zh-cmn-Hans" bukannya lang="zh-CN" yang biasa kita tulis? lang="zh-cn".
Utamakan menggunakan versi terkini IE dan Chrome
Kesan yang boleh dicapai dengan menulis cara ini ialah jika Google Chrome Frame dipasang, GCF akan digunakan untuk memaparkan halaman Jika GCF tidak dipasang, versi tertinggi kernel IE akan digunakan untuk pemaparan.
Pautan berkaitan: Dokumentasi Teg Meta Kawalan Kernel Penyemak Imbas
Baidu melarang transkod
Apabila anda membuka halaman web melalui telefon mudah alih Baidu, Baidu boleh mengubah suai Transkod halaman web anda, tanggalkan pakaian anda, dan letakkan iklan plaster kulit anjing pada badan anda Untuk tujuan ini, anda boleh menambah
Pautan berkaitan: Pernyataan transcoding SiteApp
Bahagian pengoptimuman SEO
Tajuk halaman
Kata kunci halaman
Huraian kandungan huraian halaman
Tentukan pengarang web
Tentukan kaedah pengindeksan enjin carian web ialah satu set nilai yang dipisahkan dengan koma bahasa Inggeris "," Ia biasanya mempunyai nilai berikut: tiada, noindex, nofollow, semua, indeks dan ikut.
Kod XML/HTMLSalin kandungan ke papan keratan
Pautan berkaitan: WEB1038 - Teg mengandungi nilai tidak sah
port pandangan
Viewport boleh menjadikan paparan reka letak lebih baik pada penyemak imbas mudah alih. Selalunya tulis
width=device-width akan menyebabkan sempadan hitam muncul apabila iPhone 5 ditambahkan pada skrin utama dan dibuka dalam mod skrin penuh WebApp (http://bigc.at/ios-webapp-viewport- meta.orz )
parameter kandungan:
lebar port pandangan lebar (nilai angka/lebar peranti)
tinggi port pandangan ketinggian (nilai angka/tinggi peranti)
nisbah skala awal skala awal
nisbah skala maksimum skala maksimum
minimum -skala Nisbah zum minimum
boleh berskala pengguna Sama ada untuk membenarkan penskalaan pengguna (ya/tidak)
minimal-ui Atribut baharu dalam iOS 7.1 beta 2 boleh meminimumkan bar status atas dan bawah apabila halaman dimuatkan. Ini ialah nilai Boolean dan boleh ditulis terus seperti ini:
Dan jika tapak web anda tidak responsif, sila jangan gunakan skala awal atau lumpuhkan penskalaan.
Pautan berkaitan: Viewport dengan reka bentuk tidak responsif
Untuk menyesuaikan diri dengan iPhone 6 dan iPhone 6plus, anda perlu menulis:
XML/HTML KodSalin kandungan ke papan keratan
Lebar port pandangan bagi kebanyakan peranti Android 4.7~5-inci ditetapkan kepada 360px, tetapi 375px pada iPhone 6. Lebar port pandangan bagi kebanyakan peranti Android 5.5-inci (seperti Samsung Note) ialah 400, dan ia adalah 414px pada iPhone 6 plus .
peranti ios
Tajuk ditambahkan pada skrin utama (baharu dalam iOS 6)
Sama ada hendak mendayakan mod skrin penuh WebApp
Tetapkan warna latar belakang bar status
ikon iOS
parameter rel: apple-touch-icon Imej diproses secara automatik ke sudut bulat dan sorotan. apple-touch-icon-precomposed melarang sistem daripada menambah kesan secara automatik dan memaparkan reka bentuk asal secara langsung. iPhone dan iTouch, lalai 57x57 piksel, diperlukan
iPad, 72x72 piksel, pilihan tetapi disyorkan
Retina iPhone dan Retina iTouch, 114x114 piksel, pilihan tetapi disyorkan
Saiz ikon iOS ialah 180×180 pada iPhone 6 plus dan 120x120 pada iPhone 6. Untuk menyesuaikan diri dengan iPhone 6 plus, anda perlu menambah perenggan ini
skrin percikan iOS
Dokumentasi rasmi: https://developer.apple.com/library/ios/qa/qa1686/_index.html
Artikel rujukan: http://wxd.ctrip.com/blog/2013/09/ios7-hig-24/
Skrin permulaan iPad tidak termasuk kawasan bar status.
Skrin potret iPad 768 x 1004 (peleraian standard)
Potret iPad 1536x2008 (Retina)
Landskap iPad 1024x748 (peleraian standard)
Landskap iPad 2048x1496 (Retina)
Skrin permulaan iPhone dan iPod touch termasuk kawasan bar status.
Skrin potret iPhone/iPod Touch 320x480 (resolusi standard)
Skrin potret iPhone/iPod Touch 640x960 (Retina)
iPhone 5/iPod Touch 5 skrin menegak 640x1136 (Retina)
Tambah Sepanduk Aplikasi Pintar Sepanduk Aplikasi Pintar (iOS 6 Safari)
Saiz imej yang sepadan untuk iPhone 6 ialah 750×1294, dan saiz imej yang sepadan untuk iPhone 6 Plus ialah 1242×2148.
Windows 8
Warna jubin Windows 8
Ikon jubin Windows 8
Langganan RSS
ikon favicon
Untuk pengenalan yang lebih terperinci kepada favicon, sila rujuk https://github.com/audreyr/favicon-cheat-sheet
Meta mudah alih
Kod XML/HTMLSalin kandungan ke papan keratan
Ini adalah ringkasan perkongsian daripada toobug.
Lagi rujukan tag meta
Artikel rujukan:
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
