程式師世界 >> 編程語言 >> 網頁編程 >> PHP編程 >> 關於PHP編程 >> PHP筆記（HTML篇），php筆記html

PHP筆記（HTML篇），php筆記html

編輯：關於PHP編程

PHP筆記（HTML篇），php筆記html

學過很多語言，最近終於決定要學PHP了。

學習PHP，首先總要學習HTML，那麼，我也從HTML開始吧！

首先學習任何編程語言，看再多書，都離不開它——幫助文檔

HTML幫助文檔：http://pan.baidu.com/s/1hqxOymo

不說不知道，近年來比較火的HTML5，是HTML的一個發展方向，HTML的發展方向如下圖，一邊是多元化的HTML5，另一邊是規范化的XML，過程中還衍生了XHTML！

做網頁，總避免不了要使用顏色，顏色有兩種表示法，單詞表示法和十六進制表示法，其中，十六進制表示法表示的顏色比較全，我也整理了一篇博文，以供查看。

RGB顏色表：http://blog.csdn.net/u010849590/article/details/43339473

編程語言總有一些特殊符號不能直接作為文本顯示，HTML也不例外，這些特殊符號在HTML中稱為實體，博主也整理了一篇HTML實體對照表，供不時之需。

實體對照表：http://blog.csdn.net/u010849590/article/details/43380181

網頁代碼是由浏覽器直接解析的，編寫網頁必須選擇一種編碼，常用的編碼有UTF-8、GBK、GD2312等，而浏覽器也可以選擇一種編碼去解析網頁。那麼，問題來了，如果浏覽器選擇的編碼和編寫網頁的編碼不一致怎麼辦？解決的辦法有是三個：

很明顯，一種編碼不能適合所有人，而讓用戶修改浏覽器編碼也不夠智能，所以，前兩種都是治標不治本，第三種方法才是王道。

以UTF-8為例：

<base/>標簽可設置超鏈接，如將相對路徑裝換為絕對路徑、打開方式等。<base/>是單標簽，其具體用法可參考幫助文檔。

<body>的屬性設置會默認為整個網頁的默認設置，可設置字體顏色（text）、背景顏色（bgcolor）、背景圖片（background）、背景屬性（bgproperties）等，還是查看幫助文檔！

<p>是段落標簽，這個標簽比較特殊，既可用作單標簽也可用作雙標簽。用作雙標簽時，標簽之間的內容作為一段顯示；作為單標簽時，從標簽處開始換行。雙標簽的用法比較標准，也比較普遍。

<pre>標簽是雙標簽，標簽內的文本會按照原格式輸出，與<xmp>不同，<pre>標簽內的標簽是可以被解析的，而<xmp>內的標簽是不能解析，以文本形式輸出的！

<li>標簽搭配<ol>和<ul>使用，<li>為列表（list）標簽，是雙標簽，標簽間的內容作為列表中的一項顯示，默認無序；<ol>標簽搭配<li>標簽，使列表變為有序列表；<ul>標簽搭配<li>使用，作為無序列表組。這些標簽的屬性可查看幫助文檔。

<sub>和<sup>，下標標簽和上標標簽，均為雙標簽。

<img>叫做圖像標簽，用於顯示圖片，為單標簽，src屬性設置圖片鏈接，title屬性設置鼠標放在上面時顯示的名稱，alt屬性設置圖片加載失敗顯示的名稱。其他屬性可查幫助文檔。

<a>是鏈接標簽，用於超鏈接，為雙標簽。href屬性設置鏈接地址，title屬性設置標簽放在上面時顯示的名稱，target屬性設置打開鏈接的方式，其他屬性，可查看幫助文檔。

<a>標簽設置錨點，用於鏈接到特定區域，用name屬性。name設置一個名稱，href屬性設置為"#"+name的名稱，即可鏈接到本頁name所在處；若href設置為網頁路徑+"#"+name的名稱，則可鏈接到該網頁的name所在處；herf屬性設置為"#"或為空時，跳轉到本頁頭。

當前頁跳轉

跳轉到其他頁面

URL：統一資源定位符

URL組成：以http://i.cnblogs.com/EditPosts.aspx?postid=4275104&update=1為例

協議名稱：http://、ftp://、https://、file://等（http://）
主機名：（i.cnblogs.com）（cnblogs.com是域名）
端口號：80、8080、等（范圍：0~65535）（80）
資源名稱：訪問的文件（EditPosts.aspx）
參數："?"後面的鍵值對，多個參數用"&"連接（get傳參，參數可見；post傳參，參數不可見）（postid=4275104&update=1）

URL的相對路徑：

./：代表本地路徑
../：代表上級路徑
../../：代表上上級路徑（以此類推）

<table>標簽用於構建表格，為雙標簽。width屬性設置表格的寬度，heigth屬性設置表格的高度，border屬性設置表格的邊框，cellspacing屬性設置單元格之間的寬度，cellpadding屬性設置單元格內容與邊框之間的距離。

<tr>標簽嵌套<table>標簽使用，用於設計表格的行，為雙標簽。

<td>標簽嵌套<tr>標簽使用，用於表示表格的單元格，為雙標簽。rowspan屬性設置跨行，屬性值表示跨越的行數；colspan屬性設置跨列，屬性值表示跨越的列數。

<th>標簽嵌套<tr>標簽使用，用於表示表格的表頭，單元格的內容字體加粗、居中。

更多屬性可查幫助文檔。

HTML的框架（frame），也稱為分幀，即將多個頁面組合成一個頁面顯示。

優點：
- 重載頁面時，不需要重載整個頁面，增加了網頁下載的速度
- 方便制作導航欄
缺點：
- 多個頁面，不易管理
- 代碼復雜，無法被搜索引擎索引到
- 多框架的頁面會增加服務器的http請求
- 小型的移動設備無法完全顯示
由於以上缺點，不符合標准網頁設計理念，已被拋棄，但後台可以使用，所以，還是要學習。

框架的標簽：

<frameset>標簽，雙標簽
- <frameset>標簽代替了<body>標簽，定義框架頁面，所以使用<frameset>標簽就不用<body>標簽
- border屬性設置框架邊框的大小
- rows屬性設置框架的行數及高度，需要多少行就編寫多少行的大小，“*”表示剩余空間，用“,”隔開
- cols屬性設置框架的列數及寬度，需要多少列就編寫多少列的大小，“*”表示剩余空間，用“,”隔開
- <frameset>可嵌套使用，使框架格式多元化
<frame>標簽，雙標簽
- 用於顯示每個頁面的內容，嵌套在<frameset>中使用；
- src屬性設置頁面的路徑，以顯示其內容
- name屬性可設置frame的名稱，供鏈接顯示
- <a>標簽的target屬性可指定顯示頁面的frame
- <a>標簽的target屬性設置為“_parent”時，表示它的上一級框架顯示，設置為“_top”時，表示頂級框架顯示，及整個網頁

布局顯示

超鏈接

<noframes>標簽，雙標簽
- 當浏覽器無法加載框架的時候，會顯示<noframes>標簽內的內容
- 嵌套在<frameset>標簽中使用，搭配<body>標簽使用
關於框架的其他屬性和用法，可查看幫助文檔！

表單：可以把輸入的數據傳送到服務器端的程序的html元素
- <form>標簽，雙標簽
  - 表示HTML表單
  - action屬性設置數據傳送的目的地
  - method屬性設置傳輸方式，可設置為get和post
    - get傳輸的信息較少，速度較快，提交信息會顯示在地址欄，不安全
    - post傳輸的信息較多，速度較慢，提交信息不會顯示在地址欄，較安全
  - enctype屬性設置數據發送到服務器的編碼類型
    - application/x-www-form-urlencoded：窗體數據被編碼為名稱/值對，為標准編碼格式，默認值
    - multipart/form-data：窗體數據被編碼為一條信息，頁面上的每個控件對應信息中的一部分，上傳文件時使用
- <input>標簽，單標簽
  - type，代表一個輸入域的顯示方式（分為輸入型、選擇型、點擊型）
    - text，單行文本輸入域，輸入型
    - password，密碼輸入域，輸入的字符顯示為"*"，輸入型
    - file，文件上傳，輸入型
    - checkbox，復選框，選擇型
    - radio，單選框，選擇型
    - hidden，隱藏域，一般用於傳遞默認值，
    - button，按鈕，點擊不會提交表單，可進行其他操作，點擊型
    - image，圖片按鈕，點擊會提交表單，點擊型
    - submit，提交按鈕，點擊可提交表單，點擊型
    - reset，重置按鈕，點擊型
  - name，表單項的名稱
    - 通常設置為與數據庫中相對應的字段名相同
    - 點擊型不需要該屬性
    - 傳輸數據時的標識符
    - 復選框的name值一般使用數組表示
    - 單選框的name值相同時，選項相互排斥
  - value，表單項的值
    - 選擇型設置該屬性值，選擇後，可隨表單傳輸
    - 點擊型除image，設置該屬性，即設置按鈕顯示名稱
    - 輸入型設置該屬性值，設置默認value值
  - maxlength，限制文本輸入長度
- <textarea>標簽，雙標簽
  - 多行文本域，可輸入多行文本
  - cols，設置列數，通過列數，設置寬度
  - rows，設置行數，通過行數，設置高度
  - 其余屬性與<input>標簽輸入型一致
- <select>標簽，雙標簽
  - 下拉菜單
  - name屬性設置表單項名稱，通常與數據庫字段名一致
  - multiple屬性設置表單為多選
- <option>標簽，雙標簽
  - 嵌套在<select>標簽中使用，表示下拉菜單的一個選項
  - value屬性設置選項的值，選擇後，隨表單傳輸
  - selected屬性設置默認被選中
- <lable>標簽可設定文本與選項綁定，達到點擊文本即可選擇的作用
關於表單的其他屬性和用法，可查看幫助文檔！

<div>標簽，雙標簽
- 圖層標簽，用於定位元素或布局
- 層中的內容可放到浏覽器任意位置，可放入HTML元素
- 常與CSS結合使用
由於常與CSS結合使用，在學習CSS時再深入學習！

至此，HTML的基本元素已經學完了，可以開始制作簡單的靜態網頁了，但是離動態網站還遠著呢！接著來學CSS吧！