HTML實(shí)例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Hello World</title>
</head>
<body>
<h1>我的第一個(gè)標(biāo)題</h1>
<p>我的第一個(gè)段落歉眷。</p>
</body>
</html>
基本語(yǔ)法
- HTML不區(qū)分大小寫(xiě),但HTML5建議標(biāo)簽名稱(chēng)及屬性全部用小寫(xiě)
- 常見(jiàn)的HTML標(biāo)簽都是有一個(gè)開(kāi)始標(biāo)簽和結(jié)束標(biāo)簽的
例如:<div></div>
<h1></h1>
<p></p>
- 同樣也有一部分HTML標(biāo)簽是沒(méi)有結(jié)束標(biāo)簽的
例如:<img src="" />
<br />
<hr />
<meta />
<link />
- 沒(méi)有結(jié)束標(biāo)簽的HTML標(biāo)簽榔至,可添加一個(gè)斜杠
/
表示結(jié)束,但HTML5建議不需要再加了
<head>
及</head>
頭部標(biāo)簽
-
<head>
和</head>
之間的標(biāo)簽是不可見(jiàn)的铛纬,它內(nèi)部放置的是網(wǎng)站的頭部信息嫉戚,對(duì)網(wǎng)站的顯示影響是比較大的。主要了解一下標(biāo)簽:
了解维贺,要大致記得住是什么樣子它掂,核心代碼是charset=gb2312
建議使用utf-8
<meta http-equiv="Content-Type" content="text/html; charset=gb2312或utf-8或gbk" />
了解,記住核心要點(diǎn)溯泣。定時(shí)跳轉(zhuǎn)
<meta http-equiv="refresh" content="10;URL=http://www.baidu.com" />
CSS
樣式文件加載
<link href="css/app.css" rel="stylesheet">
JS
文件加載
<script src="js/app.js'"></script>
網(wǎng)頁(yè)標(biāo)題載入:非常重要虐秋。數(shù)量可以觀察你想排名的搜索引擎對(duì)它的算法。一般建議一行顯示完垃沦。即類(lèi)似于百度搜索出來(lái)的結(jié)果中第一行的長(zhǎng)度客给。(建議長(zhǎng)度80個(gè)字符以?xún)?nèi))
<title>網(wǎng)頁(yè)標(biāo)題</title>
網(wǎng)頁(yè)關(guān)鍵詞:一般控制在三五個(gè)詞匯之間即可,不同的詞之間用逗號(hào)分隔肢簿。目前并不是很重要的一個(gè)排名參考因素(建議長(zhǎng)度100個(gè)字符以?xún)?nèi))
<meta name="keywords" content="關(guān)鍵詞1靶剑,關(guān)鍵詞2,...池充,只放置關(guān)鍵詞" />
網(wǎng)頁(yè)內(nèi)容簡(jiǎn)述:長(zhǎng)度可觀察你想排名的搜索引擎(建議長(zhǎng)度200個(gè)字符以?xún)?nèi))
<meta name="description" content="網(wǎng)頁(yè)內(nèi)容簡(jiǎn)述" />
- 移動(dòng)網(wǎng)站縮放限制標(biāo)簽
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0" />
<meta name="viewport" content="width=device-width, initial-scale=1">
width-viewport的寬度
height-viewport的高度
initial-scale - 初始的縮放比例
minimum-scale - 允許用戶(hù)縮放到的最小比例
maximum-scale - 允許用戶(hù)縮放到的最大比例
user-scalable - 用戶(hù)是否可以手動(dòng)縮放
此標(biāo)簽需要大家在做移動(dòng)網(wǎng)站的時(shí)候桩引,能想得起來(lái)即可。主要控制雙指撥動(dòng)屏幕是否能縮放瀏覽器內(nèi)容比例的縮放功能收夸。