Spesifikasi kod HTML(5).

Konvensyen pengekodan HTML

Ramai pembangun web mengetahui serba sedikit tentang konvensyen pengekodan HTML.

Antara tahun 2000 dan 2010, banyak pembangun web telah menukar daripada HTML kepada XHTML.

Menggunakan pembangun XHTML telah membangunkan standard penulisan HTML yang lebih baik secara beransur-ansur.

Untuk HTML5, kita harus membentuk piawaian kod yang lebih baik.

Gunakan jenis dokumen yang betul

Pengisytiharan jenis dokumen berada pada baris pertama dokumen HTML:

<!DOCTYPE html>

Jika anda ingin menggunakan huruf kecil seperti teg lain, anda boleh menggunakan kod berikut :

<!doctype html>

Gunakan elemen huruf kecil Nama

Nama elemen HTML5 boleh menggunakan huruf besar dan huruf kecil.

Gunakan huruf kecil disyorkan:

Gaya campuran huruf besar dan huruf kecil adalah sangat buruk.
Pembangun biasanya menggunakan huruf kecil (serupa dengan XHTML).
Gaya huruf kecil kelihatan lebih menyegarkan.
Huruf kecil mudah ditulis.

Tidak disyorkan:

<BAHAGIAN>
<p>Ini ialah perenggan. </p>
</BAHAGIAN>

Sangat teruk:

<Bahagian>
<p>Ini ialah perenggan. </p>
</BAHAGIAN>

Disyorkan:

<bahagian>
<p>Ini ialah perenggan. </p>
</bahagian>

Tutup semua elemen HTML

Dalam HTML5, anda tidak perlu menutup semua elemen (seperti <p> elemen), tetapi kami mengesyorkan menambah tag penutup pada setiap elemen.

Tidak disyorkan:

<bahagian>
<p>Ini ialah perenggan.
<p>Ini adalah perenggan.
</bahagian>

Disyorkan:

<bahagian>
<p>Ini adalah perenggan . </p>
<p> Ini adalah perenggan. </p>
</bahagian>

Tutup elemen HTML kosong

Dalam HTML5, elemen HTML kosong tidak perlu ditutup:

Kita boleh menulis seperti ini:

juga boleh ditulis seperti ini:

Slash (/) diperlukan dalam XHTML dan XML.

Menggunakan gaya ini adalah bagus jika anda mengharapkan perisian XML menggunakan halaman anda.

Gunakan nama atribut huruf kecil

Nama atribut HTML5 membenarkan penggunaan huruf besar dan huruf kecil.

Kami mengesyorkan menggunakan huruf kecil untuk nama atribut:

Adalah satu tabiat yang sangat buruk untuk menggunakan huruf besar pada masa yang sama.
Pembangun biasanya menggunakan huruf kecil (serupa dengan XHTML).
Gaya huruf kecil kelihatan lebih menyegarkan.
Huruf kecil mudah ditulis.

Tidak disyorkan:

Disyorkan:

Nilai atribut

Nilai atribut HTML5 boleh tanda petikan dihilangkan.

Kami mengesyorkan menggunakan tanda petikan untuk nilai atribut:

Jika nilai atribut mengandungi ruang, anda perlu menggunakan tanda petikan.
Gaya pencampuran tidak disyorkan, adalah disyorkan untuk menyatukan gaya.
Nilai atribut mudah dibaca menggunakan petikan.

Nilai atribut contoh berikut mengandungi ruang dan tidak dipetik, jadi ia tidak akan berfungsi:

Yang berikut menggunakan petikan berganda, yang betul:

Atribut imej

Imej biasanya digunakan atribut alt. Apabila gambar tidak dapat dipaparkan, ia boleh menggantikan paparan gambar.

Tentukan saiz imej dan simpan ruang yang ditetapkan semasa memuatkan untuk mengurangkan kelipan.

Ruang dan tanda sama

Anda boleh menggunakan ruang sebelum dan selepas tanda sama.

Tetapi kami mengesyorkan menggunakan lebih sedikit ruang:

Elakkan baris kod yang terlalu panjang

Apabila menggunakan editor HTML, adalah menyusahkan untuk menatal kod ke kiri dan kanan.

Kekalkan setiap baris kod kepada kurang daripada 80 aksara.

Baris kosong dan lekukan

Jangan tambah baris kosong tanpa sebab.

Tambahkan baris kosong pada setiap blok fungsi logik untuk menjadikannya lebih mudah dibaca.

Gunakan dua ruang untuk lekukan, TAB tidak disyorkan.

Jangan gunakan garis kosong atau lekukan yang tidak perlu di antara kod yang lebih pendek.

Baris dan inden kosong yang tidak perlu:

<badan>

<h1>tapak web Cina php</h1>

<h2>HTML</h2> ;

<p> Laman web PHP Cina, belajar bukan sahaja teknologi, tetapi Ia adalah impian.
Laman web php Cina, apa yang anda pelajari bukan sahaja teknologi, tetapi juga impian.
Laman web php Cina, apa yang anda pelajari bukan sahaja teknologi, tetapi juga impian,
php laman web Cina, apa yang anda pelajari bukan sahaja teknologi, tetapi juga impian.
🎜>>
Disyorkan:
<
badan>

laman web php Cina</h1>

<h2></ h2>

<p>php laman web Cina, apa yang anda pelajari bukan sahaja teknologi, tetapi juga mimpi. Laman web Cina php, apa yang anda pelajari bukan sahaja teknologi, tetapi juga impian. Laman web Cina php, apa yang anda pelajari bukan sahaja teknologi, tetapi juga impian. Laman web Cina php, apa yang anda pelajari bukan sahaja teknologi, tetapi juga impian. </p
></badan

> ;

表格实例:

<jadual>
<<🎜 🎜>tr>    <
th>Nama< 🎜>/th>    <
th>Penerangan< /th>    <
/tr> <
tr>     <
td>A</td>    <
td>Penerangan A</td> ;    <
/tr> <
tr>     <
td>B</td>    <
td>Penerangan tentang B</td> ; <
/tr><
/meja >

Contoh senarai:

<ol>
<li>London</li>
< li>Paris</li>
, <li>Tokyo</li>
</ol>

Abaikan <html> dan <body>?

Dalam HTML5 standard, teg <html> dan <body>

Dokumentasi HTML5 berikut adalah betul:

Instance

<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>

<h1>这是一个标题</h1>
<p>这是一个段落。</p>

Run Instance»

Klik" Butang Jalankan Contoh" untuk melihat tika dalam talian

Mengabaikan teg <html> dan <body> tidak disyorkan. Elemen

<html> ialah elemen akar dokumen dan digunakan untuk menerangkan bahasa halaman:

< !DOCTYPE html>
<html lang="zh">

Bahasa yang diisytiharkan adalah untuk kemudahan pembaca skrin dan enjin carian.

Mengabaikan <html> atau <body> akan ranap dalam perisian DOM dan XML.

Mengabaikan <body> akan menyebabkan ralat dalam penyemak imbas lama (IE9).

Tinggalkan <head>?

Dalam HTML5 standard, teg <head>

Secara lalai, penyemak imbas akan menambahkan kandungan sebelum <body> pada <head> pada unsur-unsur.

Instance

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
<body>

<p id="Demo">段落 1。</p>
<p id="demo">段落 2。</p>
<script>
// 只有段落 2 会被替换
document.getElementById("demo").innerHTML = "HELLO。";
</script>

</body>
</html>

Run Instance»

Klik butang "Run Instance" untuk melihat contoh dalam talian

	现在省略 head 标签还不推荐使用。

Metadata

Elemen <title> dalam HTML5 diperlukan Nama tajuk menerangkan tema halaman:

<<🎜. > tajuk>tapak web php Cina</tajuk>

Tajuk dan bahasa membolehkan enjin carian memahami topik halaman anda dengan cepat:

<!DOCTYPE html >
<html lang="zh">
<kepala>
<meta charset="UTF-8">
<tajuk>tapak web Cina php</tajuk><>
</head>

Komen HTML

Ulasan boleh ditulis dalam  dalam:

adalah agak panjang Komen boleh ditulis dalam baris berasingan antara :

Watak pertama komen panjang diindenkan dengan dua ruang untuk memudahkan pembacaan.

Helaian gaya

Helaian gaya menggunakan format sintaks ringkas (atribut jenis tidak diperlukan):

< pautan rel="stylesheet" href="styles.css">

Peraturan ringkas boleh ditulis dalam satu baris:

p.ke {font-family: Verdana; saiz fon: 16em;}

Peraturan panjang boleh ditulis dalam berbilang baris:

badan {
warna latar: kelabu muda;
fon-keluarga: "Arial Hitam", Helvetica, sans-serif;
saiz fon: 16em;
warna: hitam;
}

Letakkan pendakap kerinting kiri pada baris yang sama dengan pemilih
Pendakap kerinting kiri berada pada baris yang sama dengan pemilih. Tambahkan ruang antara
Gunakan dua ruang untuk mengesot
Tambah ruang antara titik bertindih dan nilai atribut >
Gunakan ruang selepas koma dan simbol
Gunakan simbol
Gunakan petikan hanya jika nilai atribut mengandungi ruang
Kurungan kerinting penutup diletakkan pada baris baharu.
Memuatkan JavaScript dalam HTML
Gunakan sintaks ringkas untuk memuatkan fail skrip luaran (atribut jenis tidak diperlukan):
< ; skrip src="myscript.js">
Mengakses elemen HTML menggunakan JavaScript
HTML yang tidak diformatkan dengan baik boleh menyebabkan ralat pelaksanaan JavaScript.
Dua pernyataan JavaScript berikut akan mengeluarkan hasil yang berbeza:
Instance
```
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>

<p id="Demo">段落 1。</p>
<p id="demo">段落 2。</p>
<script>
// 只有段落 2 会被替换
document.getElementById("demo").innerHTML = "HELLO.";
</script>

</body>
</html>
```
Jalankan Instance»
Klik butang "Jalankan Contoh" untuk melihat contoh dalam talian
Cuba gunakan peraturan penamaan yang sama untuk JavaScript dalam HTML.
Akses spesifikasi kod JavaScript.
Gunakan nama fail huruf kecil
Kebanyakan pelayan web (Apache, Unix) adalah sensitif huruf besar/kecil: london.jpg tidak boleh diakses melalui London.jpg.
Pelayan web lain (Microsoft, IIS) tidak sensitif huruf besar-besaran: london.jpg boleh diakses melalui London.jpg atau london.jpg.
Anda mesti mengekalkan gaya yang konsisten dan kami mengesyorkan menggunakan nama fail huruf kecil secara konsisten.
Sambungan fail
Akhiran fail HTML boleh menjadi .html (atau r .htm).
Akhiran fail CSS ialah .css.
Akhiran fail JavaScript ialah .js . Perbezaan antara
.htm dan .html
Pada asasnya tiada perbezaan antara fail sambungan .htm dan .html. Kedua-dua pelayar dan pelayan web menganggapnya sebagai fail HTML.
Perbezaannya ialah:
.htm telah digunakan dalam sistem DOS awal, dan sistem kini hanya mempunyai tiga aksara.
Tiada sekatan khas pada akhiran dalam sistem Unix, secara amnya .html digunakan.
Perbezaan teknikal
Jika URL tidak menyatakan nama fail (seperti http://www.php.cn/css/), Pelayan akan mengembalikan nama fail lalai. Biasanya nama fail lalai ialah index.html, index.htm, default.html dan default.htm.
Jika pelayan dikonfigurasikan dengan hanya "index.html" sebagai fail lalai, anda mesti menamakan fail "index.html", bukan "index.htm".
Namun, biasanya pelayan boleh menetapkan berbilang fail lalai, bolehkah anda menetapkan fail lalai mengikut keperluan anda.
Apa pun, akhiran lengkap HTML ialah ".html".

← kuiz HTML 5

serahkan

Spesifikasi kod HTML(5).

Konvensyen pengekodan HTML

Gunakan jenis dokumen yang betul

Gunakan elemen huruf kecil Nama

Tidak disyorkan:

Sangat teruk:

Disyorkan:

Tutup semua elemen HTML

Tutup elemen HTML kosong

Gunakan nama atribut huruf kecil

Nilai atribut

Atribut imej

Ruang dan tanda sama

Elakkan baris kod yang terlalu panjang

Baris kosong dan lekukan

Baris dan inden kosong yang tidak perlu:

表格实例:

Contoh senarai:

Abaikan <html> dan <body>?

Instance

Tinggalkan <head>?

Instance

Metadata

Memuatkan JavaScript dalam HTML

Mengakses elemen HTML menggunakan JavaScript

Instance

Gunakan nama fail huruf kecil

Sambungan fail

.htm dan .html

Perbezaan teknikal

Laman web PHP Cina