整合營銷服務商
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
電腦端+手機端+微信端=數據同步管理
免費咨詢熱線：
TML超鏈接（鏈接）
超鏈接可以是一個字，一個詞，或者一組詞，也可以是一幅圖像，您可以點擊這些內容來跳轉到新的文檔或者當前文檔中的某個部分。
當您把鼠標指針移動到網頁中的某個鏈接上時，箭頭會變為一只小手。
在標簽<a> 中使用了href屬性來描述鏈接的地址。
默認情況下，鏈接將以以下形式出現在瀏覽器中：
注意：如果為這些超鏈接設置了 CSS 樣式，展示樣式會根據 CSS 的設定而顯示
HTML鏈接語法
<a href="url">鏈接文本</a>
href 屬性描述了鏈接的目標。.
HTML鏈接-target屬性
使用 target 屬性，你可以定義被鏈接的文檔在何處顯示。
HTML 鏈接- id 屬性
圖片鏈接
在當前頁面鏈接到指定位置
跳出框架
郵箱地址
html概述
HTML是 HyperText Mark-up Language 的首字母簡寫，意思是超文本標記語言，超文本指的是超鏈接，標記指的是標簽，是一種用來制作網頁的語言，這種語言由一個個的標簽組成，用這種語言制作的文件保存的是一個文本文件，文件的擴展名為html或者htm，一個html文件就是一個網頁，html文件用編輯器打開顯示的是文本，可以用文本的方式編輯它，如果用瀏覽器打開，瀏覽器會按照標簽描述內容將文件渲染成網頁，顯示的網頁可以從一個網頁鏈接跳轉到另外一個網頁。
html基本結構
一個html的基本結構如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>網頁標題</title> </head> <body> 網頁顯示內容 </body> </html>
第一行是文檔聲明，第二行“”標簽和最后一行“”定義html文檔的整體，“”標簽中的‘lang=“en”’定義網頁的語言為英文，定義成中文是’lang=“zh-CN”’,不定義也沒什么影響，它一般作為分析統計用。 “”標簽和“”標簽是它的第一層子元素，“”標簽里面負責對網頁進行一些設置以及定義標題，設置包括定義網頁的編碼格式，外鏈css樣式文件和javascript文件等，設置的內容不會顯示在網頁上，標題的內容會顯示在標題欄，“”內編寫網頁上顯示的內容。
HTML文檔類型
目前常用的兩種文檔類型是xhtml 1.0和html5
xhtml 1.0
xhtml 1.0 是html5之前的一個常用的版本，目前許多網站仍然使用此版本。
此版本文檔用sublime text創建方法： html:xt + tab
文檔示例：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title> xhtml 1.0 文檔類型 </title> </head> <body> </body> </html>
html5
pc端可以使用xhtml 1.0，也可以使用html5，html5是向下兼容的
此版本文檔用sublime text創建方法： html:5 + tab 或者 ! + tab
文檔示例：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title> html5文檔類型 </title> </head> <body> </body> </html>
兩種文檔的區別
1、文檔聲明和編碼聲明
2、html5新增了標簽元素以及元素屬性
html注釋：
html文檔代碼中可以插入注釋，注釋是對代碼的說明和解釋，注釋的內容不會顯示在頁面上，html代碼中插入注釋的方法是：
<!-- 這是一段注釋 -->
通過
、
、
、
、
,標簽可以在網頁上定義6種級別的標題。6種級別的標題表示文檔的6級目錄層級關系，比如說：
，再其次是
，以此類推。搜索引擎會使用標題將網頁的結構和內容編制索引，所以網頁上使用標題是很重要的。
<h1>這是一級標題</h1> <h2>這是二級標題</h2> <h3>這是三級標題</h3>
html段落標簽
標簽定義一個文本段落，一個段落含有默認的上下間距，段落之間會用這種默認間距隔開，代碼如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>段落</title> </head> <body> <p>HTML是 HyperText Mark-up Language 的首字母簡寫，意思是超文本標記語言，超 文本指的是超鏈接，標記指的是標簽，是一種用來制作網頁的語言，這種語言由一個個的 標簽組成，用這種語言制作的文件保存的是一個文本文件，文件的擴展名為html或者htm。 </p> <p>一個html文件就是一個網頁，html文件用編輯器打開顯示的是文本，可以用文本的方 式編輯它，如果用瀏覽器打開，瀏覽器會按照標簽描述內容將文件渲染成網頁，顯示的網 頁可以從一個網頁鏈接跳轉到另外一個網頁。</p> </body> </html>
html換行標簽
代碼中成段的文字，直接在代碼中回車換行，在渲染成網頁時候不認這種換行，如果真想換行，可以在代碼的段落中插入
來強制換行，代碼如下：
<p> 一個html文件就是一個網頁，html文件用編輯器打開顯示的是文本，可以用<br /> 文本的方式編輯它，如果用瀏覽器打開，瀏覽器會按照標簽描述內容將文件<br /> 渲染成網頁，顯示的網頁可以從一個網頁鏈接跳轉到另外一個網頁。 </p>
html字符實體
代碼中成段的文字，如果文字間想空多個空格，在代碼中空多個空格，在渲染成網頁時只會顯示一個空格，如果想顯示多個空格，可以使用空格的字符實體,代碼如下：
<!-- 在段落前想縮進兩個文字的空格，使用空格的字符實體： --> <p> 一個html文件就是一個網頁，html文件用編輯器打開顯示的是文本，可以用<br /> 文本的方式編輯它，如果用瀏覽器打開，瀏覽器會按照標簽描述內容將文件<br /> 渲染成網頁，顯示的網頁可以從一個網頁鏈接跳轉到另外一個網頁。</p>
在網頁上顯示 “<” 和 “>” 會誤認為是標簽，想在網頁上顯示“<”和“>”可以使用它們的字符實體，比如：
<!-- “<” 和 “>” 的字符實體為 < 和 > --> <p> 3 < 5 <br> 10 > 5 </p>
html塊標簽
1、
標簽 塊元素，表示一塊內容，沒有具體的語義。
2、 標簽 行內元素，表示一行中的一小段內容，沒有具體的語義。
含樣式和語義的標簽
1、 標簽 行內元素，表示語氣中的強調詞
2、 標簽 行內元素，表示專業詞匯
3、 標簽 行內元素，表示文檔中的關鍵字或者產品名
4、 標簽 行內元素，表示非常重要的內容
語義化的標簽
語義化的標簽，就是在布局的時候多使用有語義的標簽，搜索引擎在爬網的時候能認識這些標簽，理解文檔的結構，方便網站的收錄。比如：h1標簽是表示標題，p標簽是表示段落，ul、li標簽是表示列表，a標簽表示鏈接，dl、dt、dd表示定義列表等，語義化的標簽不多。
html圖像標簽
標簽可以在網頁上插入一張圖片，它是獨立使用的標簽，它的常用屬性有：
src屬性 定義圖片的引用地址
alt屬性 定義圖片加載失敗時顯示的文字，搜索引擎會使用這個文字收錄圖片、盲人讀屏軟件會讀取這個文字讓盲人識別圖片，所以此屬性非常重要。
<img src="images/pic.jpg" alt="產品圖片" />
絕對路徑和相對路徑
像網頁上插入圖片這種外部文件，需要定義文件的引用地址，引用外部文件還包括引用外部樣式表，javascript等等，引用地址分為絕對地址和相對地址。
絕對地址：相對于磁盤的位置去定位文件的地址
相對地址：相對于引用文件本身去定位被引用的文件地址
絕對地址在整體文件遷移時會因為磁盤和頂層目錄的改變而找不到文件，相對路徑就沒有這個問題。相對路徑的定義技巧：
“ ./ ” 表示當前文件所在目錄下，比如：“./pic.jpg” 表示當前目錄下的pic.jpg的圖片，這個使用時可以省略。
“ …/ ” 表示當前文件所在目錄下的上一級目錄，比如：“…/images/pic.jpg” 表示當前目錄下的上一級目錄下的images文件夾中的pic.jpg的圖片。
標簽可以在網頁上定義一個鏈接地址，它的常用屬性有：
href屬性 定義跳轉的地址
title屬性 定義鼠標懸停時彈出的提示文字框
target屬性 定義鏈接窗口打開的位置
target="_self" 缺省值，新頁面替換原來的頁面，在原來位置打開
target="_blank" 新頁面會在新開的一個瀏覽器窗口打開
HTML（HyperTextMark-upLanguage）即超文本標記語言或超文本鏈接標示語言，是WWW的描述語言。
HTML文檔的結構
2.頁面背景色或背景圖像
Hello World！
</body>
（網頁背景圖像）
Hello World!
</body>
（網頁背景色彩）
3.文本相關標簽
標題標簽<h1>－<h6>，<font>標簽。
段落標簽<p>，換行標簽<br>。
<h#> ... </h#>，#=1, 2, 3, 4, 5, 6 （說明：<h1>到<h6>字體大小依次遞減）
<sub>下標文字，<sup>上標文字，<del>刪除線。
段落標簽<p>，換行標簽<br>。
<HR> 標簽用于在頁面上繪制水平線。
圖像的基本語法：<img src=“images/adv_2.jpg” width=“300” height=“150” alt=“在線報名” >
要鏈接到同一目錄 (C:\HTML) 下的頁面，可編寫 <A HREF=“Doc1.htm”> 或 <A HREF=“C:\html\Doc2.htm”>
鏈接到本頁面：
<a href=“http://www.it.com”>
<img src=“images/adv_2.jpg” border=“0” width="300"height="150">
</a>
<marquee scrolldelay=“100” direction=“up”>
滾動文字或圖像
</marquee>
說明：scrolldelay：表示滾動延遲時間，默認值為90；direction：表示滾動的方向，默認為從右向左。
目標：掌握列表的用法
使用表格的基本結構實現簡單表格
使用表格相關標簽實現跨行、跨列的復雜表格
會使用表單的基本結構制作表單頁面
會使用各種表單元素實現注冊頁面
能理解post和get兩種提交方式的區別
格式： <ul type=“”>
type屬性設置標號的類型，值可以取：
1 disc ：實心圓點
2 circle ：空心圓點
3 square ：實心方塊
無序列表
格式：<ol type=“” start=“”>
type設置標號的類型，值可以?。?/p>
1 1：顯示數字
2 A：顯示大寫字母
3 a：顯示小寫字母
4 I：顯示大寫羅馬數字
5 i：顯示小寫羅馬數字
有序列表
嵌套列表
門戶網站應用表格
<table>...</ table >定義表格
創建表格
表格表現
域名數量報表的創建
域名數量報表
1.跨多列的表格
2.跨多行的表格
3.如何創建跨行跨列的表格
品牌商城表的創建
width用來設置表格的寬度；height用來設置表格的高度；border用來設置表格邊框尺寸大小；bordercolor用來設置表格邊框顏色。
品牌商城表
背景：background屬性用來設置表格的背景圖片；bgcolor屬性用來設置表格、行、列的背景色。
對其方式：align屬性用來設置表格、行、列的對齊方式。
<input type=“text” value="張三" size="20">
文本框的建設
文本框
<input type=“password” value=“123456” size=“22”>
密碼框的建設
密碼框，22個字符寬度
<input type="radio" value="男" checked="checked">
單選按鈕的建設
單選按鈕框
<input type=“checkbox” name="cb2" value="talk">
<textarea name=“textarea” cols=“40” rows=“6”>內容</textarea>
<input type="reset" name=“reset" value=" 重填 ">
其他表單元素：<input type=“hidden”/>表單隱藏域
<input type=“image”/>表單圖片按鈕
<input type=“file”/>文件瀏覽
<label>標簽可以綁定某個表單元素，用于擴展可以相應點擊等事件的區域
如：當點擊復選框右邊的提示文字時，該復選框也可被選中。
內容有限，關于css，div和網頁布局的部分就下次在和大家分享吧！
*請認真填寫需求信息，我們會在24小時內與您取得聯系。
