HTML的文件結構與語法
一、走進Web開發
Web執行的原理：
二、HTML
1.1什麼是html
HTML是用來描述網頁的一種語言
HTML指的是超文字標記語言(Hyper Text Markup Language)
超文字就是網頁上不光有文字，還有圖片，音樂，視訊等
標記語言是一套標記標籤（markup tag） div,span,font,i等標記
HTML使用標記標籤來描述網頁
HTML文件包含了HTMl標籤及文字內容
HTML文件也叫WEB頁面
HTML的主要目的：通過一系列標籤，來顯示網頁的不同效果，不同部分
2.html的核心標記
2.1 html的文件結構
2.2 html的註釋
<!--註釋內容-->
2.3 程式碼的規範
HTML標記不分大小寫，建議小寫。如：<font>,<Font>,<fOnt>
HTML標記屬性可有可無，有的標記沒有屬性。如:<html>,<head>,<title>等
雙標籤的內容在開始和結束標籤之前，單標籤沒有內容
HTML標籤可以互相巢狀，但一定要注意順序巢狀，外層套內層，一層套一層
2.4 標記分類
單標記：標記只有一個，不是修飾內容的而是顯示某個功能的，如果有圖片，設定編碼，設定關鍵字等。
語法: <標記名稱 屬性=”值” 屬性2=”值2”/>
例： <img src=”圖片在伺服器的地址，碟符/資料夾/檔名”/>
<ing src=”d:/php07/images/01.jpg”/>
雙標記：是修飾內容的標記，有開始有結束標記，中間要寫修飾內容。
語法：<標記名稱 屬性=”值”>要修飾的內容</標記名稱>
例： <div>內容</div><font color=”red”>文字</font>
2.5 body的屬性
Bgcolor：背景的顏色 例：<body bgcolor=”顏色”>
顏色：十六進位制、單詞、rgb方式
<body bgcolor=”green”> (單詞)
<body bgcolor=”#ba06be” (十六進位制,由0~f字元組成的六個字元）
<body bgcolor=”rgb(0,0,0) (rgb，三原色，從0-255組合）
Background：背景圖片 例：<body background=”圖片的地址”>
用background設定的圖片必須與背景相同大小
2.6 文字修飾標記
<font></font>:文字的修飾 例：<font>文字</font>
Font的標記屬性：
Color:文字的顏色 值：顏色
Size:文字的大小 值：1~6
<i></i>: 斜體
<b></b>: 加粗
<u></u>: 下劃線
<s></s>: 刪除線
<sub></sub>: 下標
<sup></sup>: 上標
2.7 排版標記
<br>:換行，在需要換行的標記後面新增br標記就可以了。
<hr>:水平線
Hr常用的屬性
Size:粗細 值:1~100
Color:顏色 值:顏色
Width:寬度 值:數值(固定)或百分比（根據瀏覽器視窗大小自動調整） 百分比一般用於響應式網站開發。
<h1>~<h6>標題標記：--->自動換行和加粗
<p></p>:段落標記
<pre></pre>:預排班標記--->程式碼怎麼寫，顯示出來就是一樣的。
2.8 div和span標記
div：是雙標記，沒有任何意義的塊元素，用的最多和css配合使用，一般為“div+css”
語法：<div>任何元素</div>
span：是雙標籤，沒有任何意義的行內元素，用的最多和css配合使用。
語法：<span>要放入的元素</span>
塊元素：不管內容有多少，都會佔整個瀏覽器的一行，一般都是用塊元素佈局
行內元素：內容多少就佔多少，一般都是行內元素巢狀到塊元素中
例：<div>我是<font color="red">div</font></div>
3.0 無序列表
語法：<ul>
<li></li>
<li></li>
<ul>
屬性：type 值型別：diss square circle
3.1 無序列表
語法：<ol>
<li></li>
<li></li>
</ol>
屬性：type ：A,a,i,I,1
static：數值
例：<ol type="a" static="3">
3.2 圖片標記
語法：<img 屬性="值" 屬性="值" 屬性="值"/>
常用屬性：
src：圖片的地址
Alt：來代替圖片沒有顯示時的描述
width：圖片的寬度
Height：圖片的高度
border：圖片的邊框
Align：圖片的對其方式
Hspace：圖片與文字的左右距離
Vspace：圖片與文字的上下距離
3.3 圖片的熱點
功能：在圖片中新增可以點選的連結
Rect：矩形 座標：右上角，左下角
circle：圓形 座標：中心點和座標半徑
poly：多邊形 座標：每兩個數字為一點
Href：跳轉的地址
Target：開啟新連結的方式 值：_blank 新視窗 _self原視窗 _parent父視窗 _top頂級視窗
3.5 滾動標記
語法：<marquee>要滾動的元素</marquee>
常用屬性：
Direction：滾動的方向
width：滾動寬度
height：滾動高度
Bgcolor：背景顏色
Scrollamount：滾動步長值，值越大，滾動越快
Scrolldelay：兩步的停留時間，以毫秒為單位，一秒=1000毫秒
Loop：滾動的次數
3.6 多媒體標記
語法：<embed></embed>
常用的屬性：
src：多媒體地址 值：路徑
width：調整多媒體寬度 值：數字
height：調整高度 值：數字