1. Langkah pertama: Buka alat pengembangan dan buka folder yang ditentukan;
2. Langkah 2: Simpan file index.html ke disk, .html adalah akhiran web;
3. Langkah 3: Mulailah menulis format dasar HTML5.
<! 1. <Head> // termasuk metadata dokumen mulai mulai <meta charset = utf-8> // deklarsi pengkodean karakter </iteme> // atur judul dokumen </head> // <body> // berarti konten dari Dokumen html <a href = http://www.baidu.com> baidu </a> // elemen hyperlink (tag) </body> // menunjukkan html </html> ///ekspresikan akhir html dokumendua. Analisis Struktur Dokumen 1.Doctype
Deklarasi Jenis Dokumen (Deklarasi Jenis Dokumen, juga dikenal sebagai Doctype). Itu terutama memberi tahu browser
Jenis tampilan file. Dalam HTML4.01 dan XHTML 1.0 sebelumnya, ini menunjukkan versi dan gaya HTML spesifik.
Sekarang HTML5 tidak perlu mewakili versi dan gaya.
<!
2.HTML ElemenPertama -tama, elemen berarti label, dan elemen HTML adalah label HTML. Elemen HTML adalah elemen yang memulai dan mengakhiri dokumen. Ini adalah label ganda, bergema dan ekor, termasuk konten.
Elemen ini memiliki atribut dan nilai: lang = zh-cn,
Ini berarti bahwa dokumen tersebut menggunakan bahasa: bahasa Cina yang disederhanakan.
<html lang = zh-cn> // Jika itu bahasa Inggris, itu en '
Halaman Cina yang disederhanakan: html lang = zh-cmn-hans
Halaman Cina Tradisional: HTML Lang = ZH-CMN-HANT
Halaman bahasa Inggris: html lang = en
3. Elemen HeadDigunakan untuk menyertakan konten metadata, data metadata termasuk: <link>, <meta>, <noscript>, <script>, <script>,
<tyle>, <title>. Isi ini digunakan untuk memberikan informasi untuk browser, seperti tautan menyediakan informasi, skrip CSS
Memberikan informasi javascript, judul menyediakan judul halaman.
<Head> ... </head> // Informasi ini tidak terlihat di halaman
<noscript> elemen digunakan untuk menentukan konten alternatif (teks) ketika skrip tidak dijalankan.
Tag ini dapat digunakan untuk mengenali browser yang dapat mengenali label <script> tetapi tidak dapat mendukung skrip.
4. Elemen MetaElemen ini digunakan untuk memberikan informasi tentang dokumentasi. cepat
Beri tahu halaman browser apa kode yang digunakan. Tentu saja, file tersebut dipertahankan
UTF8, dan browser juga mengatur UTF8 untuk menampilkan Cina dengan benar.
<meta charset = utf-8> // Selain pengaturan kode, ada lainnya
5. Elemen STITALElemen ini sangat sederhana, seperti namanya: atur judul di sudut kiri atas browser.
<Title> Struktur Dasar </iteme>
6. Elemen BadanElemen yang digunakan untuk berisi konten dokumen, yaitu bagian area browser. Semua konten yang terlihat harus ada di sini
Tambahkan elemen secara internal.
<body> ... </body>
7.A elemenHyperlink akan membahasnya secara rinci nanti.
<a href = http://www.baidu.com> baidu </a>
tiga. Diskusi Label ElementalHTML adalah bahasa tanda, dan kami telah membahas secara rinci strukturnya sekarang. Di sini, mari kita analisis ini lagi
Label atau label sering menyebutnya apa yang terdiri dari hal -hal sebagai elemen secara tertulis.
1. ElemenElemen adalah satu set label yang memberi tahu browser cara menangani beberapa konten. Setiap elemen memiliki kata kunci, seperti
<body>, <title>, <meta> adalah elemen. Nama label yang berbeda mewakili makna yang berbeda, dan akan melibatkan label paragraf, tag teks, label tautan, label gambar, dll.
Elemen umumnya dibagi menjadi dua jenis: tag tunggal (elemen udara) dan tag ganda. Label tunggal umumnya digunakan untuk mendeklarasikan atau memasukkan yuan tertentu
Misalnya, pengkodean karakter pernyataan digunakan <meta>, dan <mmg> dimasukkan ke dalam gambar; p> ... </p>.
2. Properti dan NilaiSelain divisi tunggal dan ganda, atribut internal dan nilai elemen dapat diatur. Nilai atribut ini digunakan untuk mengubah elemen
Bertindak. Misalnya, hyperlink: <a> atribut href, ganti URL di mana Anda dapat menautkan ke situs web yang berbeda.
Empat. kesatuanEntitas HTML ditampilkan oleh karakter makna khusus melalui kode fisik.
Tampilkan hasil nama entitas deskripsi nomor entitas
Ruang angkasa
<<<<<<< 2
>> lebih besar dari angka
& & & Dan nomor
tanda kutip
'' '
￠ ¢ ¢ ¢
镑 镑 £ £
圆 圆 ¥ ¥ ¥ ¥
元 元 € Euro
§ § § festival kecil
权 权 © Hak Cipta
® ® ® Merek Dagang Terdaftar
Merek Dagang ™ ™ ™
× × × nomor multiplikasi
÷ ÷ kecuali angka
5. Label Struktural BaruElemen artikel
Mewakili konten independen yang tidak terkait dengan konteks di halaman. Misalnya, artikel, posting blog, posting forum, Anda dapat menggunakannya
elemen bagian
Mewakili blok konten di halaman, seperti bab, header, footer atau bagian lain dari halaman. Ini dapat digunakan dalam kombinasi dengan H1, H2 ... dan elemen -elemen lain untuk menunjukkan struktur dokumen. Contoh: <section> ... </section>;
Mengesampingkan elemen
Ekspresikan informasi tambahan yang terkait dengan konten elemen artikel selain konten elemen artikel.
elemen header
Mewakili judul blok konten atau halaman nyata di halaman.
elemen hgroup
Tunjukkan kombinasi blok judul halaman atau halaman nyata.
Elemen footer
Menunjukkan catatan kaki dari blok konten di seluruh halaman atau halaman. Secara umum, ia akan memasukkan nama pencipta, tanggal kreatif, dan informasi kontak pencipta.
Elemen Nav
Mewakili bagian dari tautan navigasi pada halaman.
Elemen angka
Menunjukkan bagian dari konten aliran independen, yang umumnya mewakili unit independen dalam konten dokumen. Gunakan elemen FigCaption untuk menambahkan judul ke grup elemen gambar. Misalnya:
<figure> <figcaption> prc </figcaption> <p> Republik Peopele China lahir pada tahun 1949 </p> </figure>lima. Metadata
<meta> elemen dapat mendefinisikan berbagai metadata dalam dokumen, dan satu halaman HTML dapat berisi beberapa <meta>
elemen.
1. Tentukan pasangan Metadata Nama/Nilai<meta name = konten penulis = bnbbs> <meta name = deskripsi konten = ini adalah halaman html5> <meta name = kata kunci konten = html5, css3, response> <meta name = gen = gen erator konten = teks luhur 3>
Deskripsi Nama Data Metropolitan
Penulis Halaman Penulis Saat Ini
Deskripsi halaman deskripsi saat ini
Kata kunci kata kunci halaman saat ini
Alat Pengkodean Halaman Generator Saat Ini
2. Deklarasikan pengkodean karakter<Meta Charset = UTF-8>
3. Simulasi bidang header http// 5 detik melompat ke url yang ditentukan <meta http-equiv = refresh content = 5; >
Deskripsi nilai atribut
Refresh Muat Ulang Halaman Saat Ini, atau menentukan URL. Unit detik.
Tipe konten cara lain untuk mendeklarasikan pengkodean karakter
enam. Atribut GlobalSebelum itu, elemen -elemen yang kami libatkan menjelaskan data lokalnya, dan tentu saja kami juga tahu beberapa atribut global, seperti
PENGENAL. Atribut global adalah perilaku umum dari semua elemen.
1.ID Atribut<p id = ABC> paragraf </p>
Penjelasan: Atribut ID mengalokasikan pengidentifikasi unik untuk elemen. Pengidentifikasi ini biasanya digunakan untuk memberikan CSS dan JavaScript
Hubungi elemen pemilihan. Hanya ada nama ID yang sama setelah halaman.
2. Atribut Kelas<p class = ABC> paragraf </p> <p class = abc> paragraf </p> <p class = abc> paragraf </p>
Penjelasan: Atribut kelas digunakan untuk mengklasifikasikan elemen. Atur CSS -Sise pada saat yang sama melalui satu atau lebih elemen dalam dokumen
Mode.
3.AccessKey Atribut<input type = name teks = user AccountKey = n>
Penjelasan: Operasi jalan pintas, kunci yang ditentukan ALT+di bawah Windows, premis bahwa alt browser tidak bertentangan.
4. Atribut yang dapat dilawan<P ContentEditable = true> dapatkah saya memodifikasi </p>
Penjelasan: Biarkan teks berada dalam keadaan yang dapat diedit. Atau secara langsung
Atur atribut.
5. Atribut DIR<p dir = rtl> teks ke kanan </p>
Penjelasan: Biarkan teks dari kiri ke kanan (LTR), atau dari kanan ke kiri (RTL).
6. Atributnya<p hidden> teks ke kanan </p>
Penjelasan: Sembunyikan elemen.
7. Atribut Llang<p lang = en> html5 </p>
Penjelasan: Anda dapat mengatur bahasa secara lokal.
8. atribut penting<p type = aplikasi/x-shockwave-flash> </titik>3. Range 4.Outofocus 5. Mark
<mark> terutama digunakan untuk menyajikan kata -kata yang perlu menonjol secara visual. Aplikasi yang lebih khas dari label <cark> adalah untuk menampilkan kata kunci pencarian kepada pengguna dalam hasil pencarian.
Html5: <mark> </mark>
Html4: <span> </span>
6. RingkasanTag <summary> berisi judul elemen detail, dan elemen detail digunakan untuk menjelaskan detail dokumen atau dokumen yang relevan. Elemen ringkasan harus menjadi sub -elemen pertama dari elemen detail.
Html5: <details> <summary> html 5 </summary> dokumen ini mengajarkan Anda semua yang harus Anda tinggalkan html 5. </Detail>
Html4: tidak ada
7. DetalisLabel <Catalist> mendefinisikan daftar data opsional. Dengan elemen input, Anda dapat membuat daftar drop -down dari nilai input.
Datasist dan opsinya tidak akan ditampilkan, itu hanya daftar nilai input hukum.
Harap gunakan properti daftar elemen input untuk mengikat distalist.
<Input List = CRAS /> <Datalist ID = CARS> <Opsi Value = BMW> <Opsi Value = Form> <Option Value = Volvo> </datalist>9. Perintah
Ekspresikan tombol Perintah
Hanya ketika elemen perintah ada di elemen menu, elemen terlihat. Kalau tidak, elemen ini tidak akan ditampilkan, tetapi Anda dapat menggunakannya untuk menentukan tombol pintasan keyboard
<u menu> <command onClick = alert ('Hello World')> Klik saya! delapan. Label yang ditinggalkanElemen ekspresi
Basefont
besar
tengah
Font
S
memukul
Tt
U
Disarankan untuk menggantinya dengan semantik yang benar dan menggunakan CSS untuk memastikan efeknya setelah rendering
Elemen seperti bingkai
Karena banyaknya ketersediaan dan aksesibilitas kerangka kerja, spesifikasi HTML5 menghapus elemen -elemen berikut.
bingkai
frameset
noframes
Tapi HTML5 mendukung iframe.
Kelas atribut
Banyak atribut ekspresif juga dihapus dengan spesifikasi baru, sebagai berikut:
meluruskan
Tautan, vlink, alink, atribut teks pada tag tubuh
bgcolor
tinggi dan lebar
Properti menggulir pada elemen iframe
Valign
hspace dan vspace
Cellpadding, cellspacing dan atribut perbatasan pada label meja
Atribut profil pada label header
Atribut target pada tag tautan a
Atribut Longdesc Elemen IMG dan IFRAME
ABBR menggantikan akronim (digunakan untuk mewakili singkatan)
Objek menggantikan applet
UL menggantikan dir
lainnya
Struktur dokumen yang dijelaskan di atas dan label baru HTML5 yang diperkenalkan oleh editor kepada Anda. Terima kasih banyak atas dukungan Anda untuk situs web VEVB Wulin!