HTML(5) အော်စ်စ် အမူအယျင် နှင့် ကင်္ဂါ

HTML အချက်အလက်

ဝီကီ သုံးစွဲသူများ အာကာသ တွင် အချက်အလက် အရေးအချင်း အရေးအချင်း မမှန်ကန်ဘူး

2000 နှစ် မှ 2010 နှစ် အတွင်း ဝီကီ သုံးစွဲသူများ အာကာသ မှ HTML5 သို့ ပြောင်းလဲကြသည်

XHTML တွင် သုံးစွဲသူများ အချက်အလက် ပဲ အချက်အလက် အခြေခံပြုပါ

HTML5 တွင် အချက်အလက် အပြည့်အဝင် အသုံးပြုခြင်း အကျဥ်းပြတ်သည်

HTML5 ဖြင့် သင့် ကိုယ်ပိုင်အခြေခံ အုပ်ချုပ်ခြင်း အုပ်ချုပ်ခြင်း အချက်အလက်.

အောက်များ အသုံးပြုပါက အချက်အလက် အခြေခံပြုပါ

အောက်များ အသုံးပြုပါက အခြေခံပြုပါ

အိမ်ရှင် အာကာသ ကုတိုးတက်လာသည်

ပဲ အောက်များ များစွာ အသုံးပြုပါက အသုံးပြုနိုင်ပါ

အစီရင်ခံသင့် အောက်များ အသုံးပြုပါက အောက်များ အသုံးပြုပါ

အချက်အလက် အခြေခံပြုပါ

အောက်များ အသုံးပြုပါက အချက်အလက်တစ်ခုခု အရေးကြီးသည်


အောက်များ အောက်များ အသုံးပြုပါက အောက်များ အသုံးပြုနိုင်ပါ

<!doctype html>

လိင်းအောက်များ အမည်များ အောက်များ အသုံးပြုပါ

HTML5 တွင် အာကာသ အမည်များ အရေးအချင်းအရေးအချင်း အသုံးပြုခွင့်ရသည်

ကျော်ကြားပါတယ်၊ လိင်းအောက်များ အမည်များ အောက်များ အသုံးပြုပါ

  • အရေးအချင်းအရေးအချင်း အမည်များ မမှန်ကန်ဘူး
  • သုံးစွဲသူများ လိင်းအောက်များ အမည်များ အသုံးပြုကြသည် (ဥပမာ XHTML တွင်)
  • လိင်းအောက်များ အရေးကြီးသည်
  • လိင်းအောက်များ မိတ်ဆွေးမှုကို လုပ်ဆောင်ရမည်

မျှော်လင်းသည်။

<SECTION> 
  <p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>
</SECTION>

အကျဥ်းပြတ်သည်။

<Section> 
  <p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>
</SECTION>

ကောင်းမွန်သည်။

<section> 
  <p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>

အာကာသတစ်ခုခုကို ပိတ်ပေးပါ

HTML5 တွင် အာကာသတစ်ခုခုကို ပိတ်ပေးရမည်မဟုတ်ဘူး (ဥပမာ <p> အာကာသ)

ကျော်ကြားပါတယ်၊ အာကာသတစ်ခုကို ပိတ်ပေးခြင်း

看起来不好:

<section>
  <p>This is a paragraph.</p>
  <p>This is a paragraph.</p>

看起来不错:

<section>
  <p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>
  <p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>

关闭空的 HTML 元素

在 HTML5 中,关闭空元素是可选的。

允许这样:


也允许这样:


斜杠(/)在 XHTML 和 XML 中是必需的。

如果您期望 XML 软件来访问您的页面,保持这个习惯是个好主意。

使用小写属性名

HTML5 允许大小写混合的属性名。

我们建议使用小写属性名:

  • 混合属性名并不好
  • 开发者习惯于使用小写属性名(比如在 XHTML 中)
  • 小写属性名看情况更纯净
  • 小写属性名更易书写

看起来不好:

看起来不错:

属性值加引号

HTML5 允许不加引号的属性值。

我们推荐属性值加引号:

  • 如果属性值包含值,则必须使用引号
  • 混合样式绝对不好
  • 加引号的值更易阅读

这个属性值无效,因为值中包含空格:

这样是有效的:

必需的属性

请始终对图像使用 alt 属性。当图像无法显示时该属性很重要。

HTML5

请始终定义图像尺寸。这样做会减少闪烁,因为浏览器会在图像加载之前为图像预留空间。

HTML5

空格和等号

等号两边的空格是合法的:


但是精简空格更易阅读, But space-less is easier to read, and groups entities better together:


避免长代码行

当使用 HTML 编辑器时,通过左右滚动来阅读 HTML 代码很不方便。

ကြီးကြပ်သော အကျယ်အဝန်း ကို အသုံးပြုဘူး။

လမ်းကြောင်း နှင့် အကျယ်အဝန်း

မလိုအပ်သော လမ်းကြောင်း ကို အသုံးပြုဘူး။

ကြားလည်းတတ် ကြောင်း ကို အသုံးပြုဘူး။ ကြီးကြပ်သော သို့မဟုတ် အရာများ အကြီးကြပ်သော အခြား အရာများ ကို လမ်းကြောင်း အသုံးပြုဘူး။

ကြားလည်းတတ် ကြောင်း ကို အသုံးပြုဘူး။ အကျယ်အဝန်း အသုံးပြုဘူး။

မလိုအပ်သော လမ်းကြောင်း နှင့် အကျယ်အဝန်း ကို အသုံးပြုဘူး။ ကြီးကြပ်သော သို့မဟုတ် အရာများ အကြီးကြပ်သော အခြား အရာများ အကြီးကြပ်သော အခြား အရာများ အကြီးကြပ်သော အခြား အရာများ ကို လမ်းကြောင်း အသုံးပြုဘူး။ အကျယ်အဝန်း အကြီးကြပ်သော အခြား အရာများ ကို လမ်းကြောင်း အသုံးပြုဘူး။

不必要:

<body>
  

Famous Cities

Tokyo

<p> တိုကျိုသည် ဂျပန်နိုင်ငံ၏ မြို့တော်ဖြစ်ပြီး ကမ္ဘာအရပ်အချိန်၏ အခြေစိုက်နေရာ နှင့် ကမ္ဘာပေါ်တွင် အလေးအနက်အရ အလေးအနှစ်ဆုံး အရပ်အချိန် ဂျပန်အစိုးရ၏ အခြေစိုက်နေရာနှင့် အဘုရင်မိတ်ဆွေရုံ နှင့် ဂျပန်ဘုရင်မမင်းမိသားကြီးများ၏ အိမ်ဖြူများ </p>

更好:

<body>

Famous Cities

Tokyo

<p> တိုကျိုသည် ဂျပန်နိုင်ငံ၏ မြို့တော်ဖြစ်ပြီး ကမ္ဘာအရပ်အချိန်၏ အခြေစိုက်နေရာ နှင့် ကမ္ဘာပေါ်တွင် အလေးအနက်အရ အလေးအနှစ်ဆုံး အရပ်အချိန် ဂျပန်အစိုးရ၏ အခြေစိုက်နေရာနှင့် အဘုရင်မိတ်ဆွေရုံ နှင့် ဂျပန်ဘုရင်မမင်းမိသားကြီးများ၏ အိမ်ဖြူများ </p>

အဝှမ်းအမှတ်အသား

<table>
  <tr>
    <th>အမည်</th>
    <th>အကြောင်း</th>
  <tr>
  <tr>
    <td>A</td>
    <td>A အကြောင်းကျသည်</td>
  <tr>
  <tr>
    <td>B</td>
    <td>B အကြောင်းကျသည်</td>
  <tr>
</table>

အဝှမ်းအမှတ်အသား

<ol>
  <li>လန်ဒန်အ</li>
  <li>ပြင်ဖြူ</li>
  <li>တိုကျို</li>
</ol>

အပေါ်အချက် <html> နှင့် <body> ဖြုတ်ယူရန်?

HTML5 အခြေခံအဆိုအရ အပေါ်အချက် <html> နှင့် <body> အမှတ်အသားကို ဖြုတ်ယူခြင်းဖြင့် အကျိုးဆက်ဆံနိုင်သည်。

အော်ဒိလီ5 အခြေခံအဆိုအရ အရေးသတ်သော အမှတ်အသားအဖြစ်

ဌာန်ပုံ



  <title>စားစားလုပ်ငန်းအမည်</title>

<h1>ဒီအချက်အလက်သည် သတင်းရသည်</h1>
<p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>

亲自试一试

ကျမ်းကို အပေါ်အချက် <html> နှင့် <body> အမှတ်အသားကို ဖြုတ်ယူရန် ကမ်းလှမ်းခြင်းမပြုဘူး

<html> အမှတ်အသားသည် အချက်အလက်၏ အခြေခံ အမှတ်အသားဖြစ်သည်။ အမြင့်ကြည့်တန်းကို ကျမ်းကို အရေးကြီးသော နေရာဖြစ်သည်。



အကူအညီသူများအတွက် (အမြင့်ကြည့်တန်း) နှင့် ရှာဖွေတတ်သော ဘာသာသံများအတွက် ဘာသာသံများကို အရေးကြီးသည်。

အပေါ်အချက် <html> နှင့် <body> ဖြုတ်ယူခြင်းသည် အကိုင်တန်းသို့ နှင့် XML ပုံစံများကို ဖြုတ်ယူခြင်းဖြင့် ပျက်စီးစေနိုင်ပါသည်。

အပေါ်အချက် <body> ဖြုတ်ယူခြင်းသည် အခြေခံ ဘာသာသံများကို (IE9) တွင် အမှားကို ဖြစ်ပေါ်စေသည်。

အပေါ်အချက် <head> ဖြုတ်ယူရန်?

HTML5 အခြေခံအဆိုအရ အပေါ်အချက် <head> အမှတ်အသားကို ဖြုတ်ယူခြင်းဖြင့် အကျိုးဆက်ဆံနိုင်သည်。

မူကြမ်းအားဖြင့် ဘာသာသံများကို <body> အချက်အလက်အထိ အသုံးပြုခြင်းဖြင့် ဘာသာသံများကို မူကြမ်းအချက်အလက်အား ထိရောက်စေသည်。

အပေါ်အချက် <head> အမှတ်အသားကို ဖြုတ်ယူခြင်းဖြင့် သင့်တင်စားလုပ်ငန်း၏ အပြင်းအထန်သောသိပ်သည့်ပုံစံကို နည်းပါးစေပါသည်:

ဌာန်ပုံ


<html>
<title>စားစားလုပ်ငန်းအမည်</title>
<body>
  <h1>ဒီအချက်အလက်သည် သတင်းရသည်</h1>
  <p>ဒီအချက်အလက်သည် ပုံစံတစ်ခုဖြစ်သည်。</p>


亲自试一试

အစီရင်ခံ对于 web 开发者,省略标签的做法是陌生的。建立规则需要时间。

元数据

元素在 HTML5 中是必需的。请尽可能制作有意义的标题。</p> <pre class="language-html"> <title>HTML5 Syntax and Coding Style

为了确保恰当的解释,以及正确的搜索引擎索引,在文档中对语言和字符编码的定义越早越好:




  
  HTML5 Syntax and Coding Style

HTML အစီအစဥ်

短注释应该在单行中书写,并在 之前增加一个空格:

长注释,跨越多行,应该通过 在独立的行中书写:


长注释更易观察,如果它们被缩进两个空格的话。

样式表

请使用简单的语法来链接样式表(type 属性不是必需的):


短规则可以压缩为一行,就像这样:

p.into {font-family:"Verdana"; font-size:16em;}

长规则应该分为多行:

body {
  background-color: lightgrey;
  font-family: "Arial Black", Helvetica, sans-serif;
  font-size: 16em;
  color: black;
}
  • အတိုင်းအတာ အဖွက် နှင့် အချိန်ချိန် အကွက် အကွက် တွင် တူတွဲပါ
  • အတိုင်းအတာ အဖွက် အချိန်ချိန် အကွက် အကွက် ထည့်သွင်းပါ
  • နှစ်ခုမျှ အကွက် အစိတ်အစိတ် အသုံးပြုပါ
  • အချိန်ချိန် နှင့် အချိန်ချိန် အကွက် အကွက် အကြာ တွင် အချိန်ချိန် အကွက် အကွက် ထည့်သွင်းပါ
  • အချိန်ချိန် အဖွက် အကွက် နှင့် အစား တွင် အချိန်ချိန် အကွက် အကွက် ထည့်သွင်းပါ
  • အချိန်ချိန် အဖွက် အကွက် နှင့် အစား ကို အချိန်ချိန် အဖွက် အကွက် ထည့်သွင်းပါ
  • အချိန်ချိန် ကို အားလုံး အစား ကို အချိန်ချိန် အဖွက် အကွက် ထည့်သွင်းပါ
  • အတိုင်းအတာ အဖွက် ကို အခွင့်ကျ တစ်ကြိမ်တည်း ကို ထည့်သွင်းပါ
  • တစ်ကြိမ်တည်း ကို 80 ကြောင်း ထက် လိုက်သည် ကို ကာကွယ်ပါ

အစီရင်ခံကိုယ်ဝင်ချက် သို့မဟုတ် စက်တင်သည် တွင် အချိန်ချိန် အစား အားလုံး ရိုးရိုးအုပ်စံကိစ္စ

ဟိုင်တာ မှတ်ဆက်လုပ်သည်

请使用简单的语法来加载外部脚本(type 属性不是必需的):