Html_Head部分及基本塊級標簽_Day01
阿新 • • 發佈:2017-05-28
中文編碼 nbsp 代碼格式 基本 ext 符號 -h 水平線 bsp
主要總結內容總結如下:
1. <!DOCTYPE>:
Html的文檔類型聲明。
聲明該文件是Html 5文件,
讓瀏覽器按照Html 5準備進行解析顯示。
文檔聲明在Html文件中必須要有,而且必須寫在文件最上方。
如:<!DOCTYPE html>
2. 註釋:
寫給程序員看的,網頁不顯示。
html中的註釋的快捷鍵是:“Ctrl+/”。
3. <head></head> 頭:
用於描述網頁的一些關鍵信息,例如網頁的配置、設置、關鍵字等。。。
這些信息,大多網頁的瀏覽器看不到,但是對網頁的解析至關重要!
4. <meat/> 標簽用於描述網頁的各種信息。
(1)其中:<meta charset="utf-8" />這是網頁的編碼格式為:UTF-8格式。
常見的中文編碼格式有:
GB2312:國標碼,簡體中文;
GBK:擴展國標碼,簡體中文;
UTF-8:萬國碼,兼容各種語言的編碼。常用!!!
(2)設置網頁的關鍵字有助於搜索引擎的搜索。
name="keywords"表示這個meta標簽設置的是網頁的關鍵字;
content="..."表示關鍵字的詳細信息,多個關鍵字用英文的逗號分開;
如:<meta name="keywords" content="傑瑞教育,H5周末班,網頁開發" />
(3)設置網頁的描述信息,搜索引擎搜索的時候,標題下面的一段文字!非常重要!!!
name="description"表示這個meta標簽設置的是網頁的詳細信息;
content="..."表示描述信息的詳細內容;
如:<meta name="description" content="這是我在傑瑞教育開發的第一個網頁!" />
5. <title></title>:網頁的標題,顯示在瀏覽器選項卡上面的文字!
如:<title></title>
6. <link/>:鏈接網頁的小圖標:網頁選項卡上的小圖片!
rel=“icon” 表示當前link的作用是鏈接網頁的圖標;
href="img/icon.jpg"href表示圖標的地址在什麽地方。
如:<link rel="icon" href="img/icon.jpg" />
7. HTML的標簽的基本分類:
1.塊級標簽:顯示為塊狀,獨占一行,自動換行。
2.行級標簽:在一行中,從左往右依次排列,不會自動換行。
8. h標簽:標題標簽,顯示為黑體加粗!!!
標題標簽一共6種:
h1~h6:h1最大,h6最小!
如:<h1>這是H1標簽</h1>
<h2>這是H2標簽</h2>
<h3>這是H3標簽</h3>
<h4>這是H4標簽</h4>
<h5>這是H5標簽</h5>
<h6>這是H6標簽</h6>
9. <hr />標簽:表示一條水平線。
如:<hr />
10. <p></p>標簽:表示段落標簽。相當於文章中的一段文字。
如:<p></p>
11. <br/>標簽:
換行符。
註意:在代碼中直接換行瀏覽器是不認識的,必須使用換行符<br/>告訴瀏覽器
這裏要還行。
如:<br/>
12. <pre>標簽:
表示預格式標簽。會保留代碼中的空格、回車等符號,直接在瀏覽器上顯示。
常用於在網頁中顯示代碼,保留代碼格式。
如:<pre></pre>
13. <blockquote></blockquote>:塊引用標簽,表明一段話是從其他網站引用的。
有一個重要屬性:cite:""表示這段話的引用來源,常放一個網站的地址。
但瀏覽器不顯示。
如:<blockquote cite="http:www.jredu100.com"></blockquote>
今日練習:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>唐詩三百首</title> <link rel="icon" href="img/icon.jpg" /> </head> <body> <h2> 唐詩三百首 </h2> <hr/> <h3>目錄</h3> <!--<pre> 第一首,靜夜思 第二首,憶江南 第三首,長恨歌 </pre>--> <p>第一首,靜夜思</p> <p>第二首,憶江南</p> <p>第三首,長恨歌</p> <hr/> <h4>靜夜思</h4> <p>作者:李白</p> <p>床前明月光,疑是地上霜。舉頭望明月,低頭思故鄉。</p> <!--<pre> <h4>靜夜思</h4> 作者:李白 床前明月光,疑是地上霜。舉頭望明月,低頭思故鄉。 </pre>--> <hr/> <pre> <h4>【李白簡介】</h4> 李白,字太白,號青蓮居士,自稱與李堂皇室同宗,祖籍隴西成紀(今甘肅天水附近),生於中亞碎葉。據野史記載,幼時隨父遷居綿州昌隆(今四川江油)青蓮鄉...... ↖ ↑ ↗ ← ㊣ → ↙ ↓ ↘ </pre> </body> </html>
運行結果:
總結:學習中遇到了一些小問題,如:p標簽的效果沒有仔細看,錯誤的使用了pre標簽,導致顯示結果有細微的差別。
Html_Head部分及基本塊級標簽_Day01