cari

Rumah >hujung hadapan web >Tutorial H5 >Sambungan elemen HTML5 HTML (Bahagian 1) - Gambaran keseluruhan elemen yang baru ditambah dan kemahiran tutorial usage_html5

Sambungan elemen HTML5 HTML (Bahagian 1) - Gambaran keseluruhan elemen yang baru ditambah dan kemahiran tutorial usage_html5

WBOY
WBOYasal
2016-05-16 15:49:551775semak imbas

Pertimbangkan proses kami membangunkan halaman :
1. Reka bentuk struktur halaman - HTML: Proses ini adalah untuk membina struktur halaman web menggunakan pelbagai elemen HTML.
2. Reka bentuk penampilan halaman - CSS: Proses ini adalah untuk menggunakan CSS untuk menambah baik penampilan halaman web.
3. Reka bentuk gelagat halaman - Javascript: Proses ini adalah untuk menetapkan gelagat tertentu pada elemen halaman web.
Selain CSS, HTML5 telah dikembangkan kepada pelbagai peringkat dalam dua aspek yang lain. Siri ini tertumpu pada aspek pertama. Sebelum ini, kami telah mempelajari tentang elemen kanvas dan svg yang kompleks. Bab berikut akan meringkaskan elemen lain yang ditambahkan oleh HTML5.

Elemen struktur
HTML5 menambah elemen struktur baharu, seperti pengepala, pengaki, navigasi navigasi, artikel kandungan, bahagian, dsb. Maksudnya seperti di bawah:

Selain elemen struktur keseluruhan halaman ini, HTML5 juga menambah elemen semantik peringkat blok, seperti elemen tambahan diketepikan, angka elemen imej, butiran elemen penerangan terperinci, dsb. Selain memaparkan maksud reka letak halaman dengan lebih baik, elemen ini tidak berbeza daripada div biasa Anda masih perlu bergantung pada CSS untuk memaparkan elemen ini. Berikut ialah contoh mudah:

Salin kod
Kodnya adalah seperti berikut:

< ;html>

Dxy Blog





Perkara 1


< ;p>Pengenalan





Pengenalan







Hak cipta 2012 /p>






Walaupun elemen ini agak mudah digunakan, tetapi ada masih terdapat beberapa perkara yang perlu diperhatikan
: 1 Jangan gunakan bahagian sebagai pengganti div Seksyen bukan bekas gaya. Elemen bahagian mewakili bahagian semantik kandungan yang membantu membina ringkasan dokumen. Ia harus mengandungi pengepala. Ia biasanya wujud sebagai sebahagian daripada artikel (sudah tentu artikel juga boleh menjadi sebahagian daripadanya). Jika anda sedang mencari elemen untuk digunakan sebagai bekas halaman atau memerlukan bekas gaya tambahan, kekal dengan div.
2. Hanya gunakan pengepala dan hgroup apabila diperlukan
Tidak bermakna menulis tag yang tidak perlu ditulis. Senario penggunaan pengepala dan hgroup biasanya seperti berikut:
• Elemen pengepala mewakili satu set teks tambahan pengenalan atau navigasi, yang sering digunakan sebagai ketua bahagian.
• Apabila pengepala mempunyai berbilang lapisan struktur, seperti sub-kepala, sari kata, pelbagai logo, dsb., gunakan hgroup untuk menggabungkan elemen h1-h6 sebagai pengepala bahagian.
Jika terdapat hanya beberapa elemen pengepala dalam pengepala atau hgroup di sini, mengapa tidak mengalih keluar dua teg yang tidak berguna ini, sebagai contoh:



Salin kodKodnya adalah seperti berikut:


　

　

Catatan blog terbaik saya


　

-->
-->


Ubah suai terus kepada:
Salin kod
Kodnya ialah seperti berikut:



　

Catatan blog terbaik saya


　
< /article>


Perkara yang sama:
Salin kod
Kod Seperti berikut:


Tukar terus kepada:




Salin kod

Kodnya adalah seperti berikut:

Catatan blog terbaik saya

oleh Rich Clark< ;/ p>


3 Jangan menyalahgunakan elemen nav
untuk mewakili blok dalam halaman yang memaut ke halaman lain atau bahagian lain halaman ini; blok pautan navigasi.
Tetapi tidak semua pautan pada halaman perlu diletakkan dalam elemen navigasi - elemen ini bertujuan untuk digunakan sebagai blok navigasi utama. Untuk memberikan contoh khusus, selalunya terdapat banyak pautan dalam pengaki, seperti syarat perkhidmatan, halaman utama, halaman pernyataan hak cipta, dsb. Elemen footer itu sendiri sudah memadai untuk mengendalikan situasi ini Walaupun elemen nav juga boleh digunakan di sini, kami biasanya menganggap ia tidak perlu.
4. Jangan menyalahgunakan angka
Rajah haruslah "sebahagian kandungan yang mengalir, kadangkala dengan perihalan tajuknya sendiri biasanya dirujuk sebagai unit bebas dalam aliran dokumen." . Senario terpakai terbaik - ia boleh dialihkan dari halaman kandungan utama ke bar sisi tanpa menjejaskan aliran dokumen. Angka hanya boleh dirujuk dalam dokumen, atau dikelilingi oleh elemen bahagian.
Jika angka itu semata-mata untuk pembentangan (seperti logo), ia tidak dirujuk di tempat lain dalam dokumen, dan tidak perlu mengalihkan kedudukan, maka sama sekali tidak menggunakan angka.
5. Jangan gunakan atribut jenis yang tidak diperlukan
Dalam HTML5, elemen skrip dan gaya tidak lagi memerlukan atribut jenis. Sudah tentu, tidak ada salahnya menulisnya, tetapi dari sudut amalan terbaik, tidak perlu menulisnya.


Elemen audio



Elemen audio digunakan untuk mengenal pasti kandungan bunyi, seperti muzik atau mana-mana strim audio lain. Format yang disokong oleh elemen ini ditunjukkan dalam jadual berikut:
Teg

audio mempunyai beberapa atribut yang digunakan untuk mengawal kandungan, masa dan cara memainkan audio Atribut ini ialah: src (nama fail), pramuat (dimuatkan apabila halaman dimuatkan), kawalan (kawalan paparan) , gelung. (gelung) dan automain (main automatik). Dalam contoh di bawah, audio akan dimainkan sebaik sahaja halaman dimuatkan dan kawalan yang disediakan akan membolehkan pengguna menghentikan atau memulakan semula audio:

<.> Salin kodKod adalah seperti berikut:


Jika penyemak imbas tidak menyokong elemen, maklumat teks elemen dipaparkan.
Jika elemen automain ditetapkan, atribut pramuat diabaikan secara automatik. Jika preload="auto" ditetapkan, audio akan dimuatkan selepas halaman dimuatkan.
elemen audio membenarkan penetapan berbilang elemen sumber agar serasi dengan isu penyemak imbas. Elemen sumber boleh memautkan fail audio yang berbeza. Penyemak imbas akan menggunakan format pertama yang dikenali:


Salin kod Kodnya adalah seperti berikut:



Elemen Video Elemen video membolehkan anda memainkan klip video atau menstrim media visual. Format yang disokong oleh elemen ini ditunjukkan dalam jadual berikut:

Ia mempunyai semua atribut elemen audio, ditambah: diredam (redam), poster (menunggu gambar), lebar dan tinggi. Tidak perlu dikatakan dua makna terakhir. Atribut poster (menentukan URL mutlak atau relatif) membolehkan anda mencari imej untuk digunakan apabila video sedang dimuatkan atau apabila video tidak dimuatkan sama sekali bermaksud redam.

Video juga menyokong penggunaan elemen sumber untuk menyelesaikan isu keserasian. Lihat contoh kecil:

Salin kod
Kodnya adalah seperti berikut:




Penyemak imbas anda tidak menyokong elemen video.


Jika anda tidak mahu memainkan bunyi video, tetapkan muted="muted".
Selain itu, elemen video juga menyediakan beberapa kaedah, sifat dan acara untuk menyokong mengawal proses main balik semasa operasi DOM. Contohnya, panggil main, jeda, muatkan dan kaedah elemen lain. Terdapat juga atribut seperti kelantangan dan masa main balik yang boleh dibaca atau ditetapkan secara langsung. Di samping itu, terdapat permainan mula, jeda, acara tamat, dan lain-lain yang boleh digunakan. Lihat contoh di bawah:

Salin kod
Kodnya adalah seperti berikut:



">Main/ Jeda


< butang onclick="makeNormal()">Normal




Latihan PHP dalam talian kebajikan awam，Bantu pelajar PHP berkembang dengan cepat！

Tentang kitaPenafianSitemap

© php.cn All rights reserved