java大神班教程訪問html

1、HTML復(fù)習(xí)大綱1 了解html語言Html(Hypertext Markup Language),超文本標(biāo)記語言，它是互聯(lián)網(wǎng)上應(yīng)用最廣泛的標(biāo)記語言。文件的命名方式為index.html（推薦） 或者index.htm。區(qū)分HTMl4.01和XHTML(約束):XHTML:eXtensible Hypertext Markup Language,可拓展的超文本標(biāo)記語言,比HTML更嚴(yán)格,可以理解XHTML是新的HTML規(guī)范;所有標(biāo)簽必須閉合，也就是說開始標(biāo)簽要有相應(yīng)的結(jié)束標(biāo)簽。另外，XHTML中所有的標(biāo)簽必須小寫。而按照HTML 2.0以來的傳統(tǒng)，很多人都是將標(biāo)簽大寫，這點兩者的差異顯著。在X

2、HTML中，所有的參數(shù)值，包括數(shù)字必須用雙引號括起來（而在HTML中，引號不是必須的，當(dāng)內(nèi)容只是數(shù)字、字母及其它允許的特殊字符時，可以不用引號;除此之外XHTML廢棄了部分HTML中的標(biāo)簽屬性;認識DHTML:DHTML是Dynamic HTML的簡稱，就是動態(tài)的html，是相對傳統(tǒng)的靜態(tài)的html而言的一種制作網(wǎng)頁的概念。所謂動態(tài)HTML(Dynamic HTML，簡稱DHTML)，其實并不是一門新的語言，它只是HTML、CSS和客戶端腳本的一種集成，即一個頁面中包括html+css+javascript(或其它客戶端腳本)，其中css和客戶端腳本是直接在頁面上寫而不是鏈接上相關(guān)文件。DHT

3、ML不是一種技術(shù)、標(biāo)準(zhǔn)或規(guī)范，只是一種將目前已有的網(wǎng)頁技術(shù)、語言標(biāo)準(zhǔn)整合運用，制作出能在下載后仍然能實時變換頁面元素效果的網(wǎng)頁設(shè)計概念,一般的使用法是: 1.通過HTML把網(wǎng)頁標(biāo)記為各個元素;2.利用CSS設(shè)計元素之間的排版樣式，并控制各個標(biāo)簽的位置;利用javascript來控制各個標(biāo)簽;認識HTML5:雖然W3C一直呼吁HTML設(shè)計師遵循HTML標(biāo)準(zhǔn),但是現(xiàn)實的HTML設(shè)計師都理會這個善意的忠告,也就是說目前互聯(lián)網(wǎng)上的大部分HTML頁面都是不規(guī)范的,主要的有以下幾種情況:元素的標(biāo)簽名大小寫混雜;如: 內(nèi)容元素標(biāo)簽沒有合理結(jié)束;如:內(nèi)容,沒有寫結(jié)束標(biāo)簽;元素標(biāo)簽使用了屬性,但是沒有指定屬性值

4、:如:元素標(biāo)簽有屬性值得時候,屬性值沒有使用引號:如:W3C發(fā)現(xiàn)這種”惡習(xí)”真的改不了的時候,就索性承認了他們是符合規(guī)范的.除了”妥協(xié)”之外,HTML5的優(yōu)勢不容小視,主要是增強了Web應(yīng)用程序的功能如客戶端校驗,繪圖支持,多媒體支持等;第一個html示例：頁面的標(biāo)題這是我的第一個html頁面2 顯示頁面HTML采用瀏覽器來顯示。因為瀏覽器的內(nèi)核不一樣，所以有的時候會出現(xiàn)差異。這也就是瀏覽器不兼容的問題。IE : 非IE: 遵循W3C規(guī)范3 HTML組成3.1 HTML語言的語法3.1.1 HTML基本結(jié)構(gòu)3.1.2 注釋標(biāo)簽;在瀏覽器里面鼠標(biāo)右鍵查看網(wǎng)頁源代碼是依然可以看見注釋的內(nèi)容3.1.

5、3 標(biāo)簽(元素)HTML的標(biāo)簽不區(qū)分大小寫,但是為了兼容XHTML,建議大家都小寫;雙標(biāo)簽：開始標(biāo)簽和結(jié)束標(biāo)簽一起出現(xiàn)，如:要顯示的文字 沒有斜杠的是開始標(biāo)簽，有斜杠的是結(jié)束標(biāo)簽。單標(biāo)簽： ,規(guī)范的寫法是在右尖括號前加上反斜杠。3.1.4 屬性和值 小碼哥教育 color:屬性名red:屬性值屬性和屬性值用“=”連接,假如屬性值是阿拉伯?dāng)?shù)字或英文字母可以不使用引號（單引號或雙引號）,假如屬性值是漢字，那么一定得加上引號,建議都使用引號。每個標(biāo)簽都有id,style,class等核心屬性;3.1.5標(biāo)簽屬性標(biāo)簽屬性中分了三種：1 HTML 標(biāo)準(zhǔn)屬性，可以理解成事幾乎所有的HTML和XHTML都有

6、支持的屬性； HYPERLINK att_standard_class.asp.htm class 規(guī)定元素的類名（classname）； HYPERLINK att_standard_id.asp.htm id 規(guī)定元素的唯一 id HYPERLINK att_standard_style.asp.htm style 規(guī)定元素的行內(nèi)樣式（inline style） HYPERLINK att_standard_title.asp.htm title規(guī)定元素的額外信息（可在工具提示中顯示）以及其它的語言鍵盤屬性等，上面是幾個比較常用的屬性。2 標(biāo)簽上的可選和必選屬性，這些屬性只針對單個的標(biāo)簽有

7、效果；3 事件屬性，HTML 4 的新特性之一是可以使 HTML 事件觸發(fā)瀏覽器中的行為，比方說當(dāng)用戶點擊某個 HTML 元素時啟動一段 JavaScript3.1.6嵌套標(biāo)簽?zāi)愫?正確你好 錯誤,瀏覽器很仁慈,顯示沒問題注意:寫標(biāo)簽的時候,標(biāo)簽與標(biāo)簽之間是不允許錯亂嵌套.3.1.6 特殊字符與轉(zhuǎn)義字符&“空格空格4 HTML常見標(biāo)簽4.1 HTML常見的基本標(biāo)簽:定義HML注釋的標(biāo)簽;:定義HTML文檔的根標(biāo)簽;:定義HTML頁面的頭部標(biāo)簽;:定義HTML頁面標(biāo)題,放置于之間;:定義HTML頁面主體部分;：定義文件信息,對網(wǎng)頁進行說明，便于搜索引擎查找,放置于之間；設(shè)置關(guān)鍵字：設(shè)置描述： 設(shè)

8、置作者： 設(shè)置字符集：設(shè)置頁面定時跳轉(zhuǎn)：:用于引入CSS文件,一般放于之間;:用于引入JavaScript文件,一般放于之間;到:定義標(biāo)題一到標(biāo)題六,和world一致;:定義段落,使用如:床前明月光疑是地上霜:定義文檔中的結(jié)構(gòu);為HTML提供結(jié)構(gòu)和背景;:和基本相似,區(qū)別是定義的節(jié)默認不換行;:單標(biāo)簽,插入一個換行;:單標(biāo)簽,定義一條水平線;:網(wǎng)頁的內(nèi)容默認是居左顯示,而之間的內(nèi)容居中;:用于設(shè)置字體顏色,大小,字體;X2 + Y2 = Z2O2 +2H2 = 2H2O,之間的默認情況下效果區(qū)別:.標(biāo)簽不會導(dǎo)致?lián)Q行,.會換行,而.會產(chǎn)生一個段落,所以段落和段落之間默認有很大的間距;4.2 文本

9、格式化標(biāo)簽:定義粗體文本;我是粗體文本:定義斜體文本;:定義強調(diào)文本,效果和差不多;:定義粗體文本,和效果差不多;:定義上標(biāo)文本,主要做數(shù)學(xué)上的次方表達式;:定義下標(biāo)文本,主要做化學(xué)上的分子式;:定義文本顯示方向,屬性dir值有l(wèi)tr(左到右)和rtl(右到左);:定義刪除體文本,即文本有中線;4.3 語義相關(guān)標(biāo)簽:表示一個地址,瀏覽器默認以斜體顯示其包含文本;:該標(biāo)簽表示的文本可”預(yù)格式化”,即該標(biāo)簽?zāi)鼙Ａ粑谋局械目崭?回車,制表符等字符;:可定義閃爍文本,但是有瀏覽器不兼容問題;4.4 超鏈接和錨點:可定義錨(anchor),錨有兩種用法：通過使用 href 屬性，創(chuàng)建指向另外一個文檔的鏈

10、接（或超鏈接）;通過使用 name 或 id 屬性，創(chuàng)建一個文檔內(nèi)部的書簽（也就是說，可以創(chuàng)建指向文檔片段的鏈接）;第一章 第二章第一章內(nèi)容第二章內(nèi)容 標(biāo)簽的兩個重要屬性:href:它指鏈接的目標(biāo),也就是超鏈接關(guān)聯(lián)的另一個資源;taret:指定使用框架集中的哪個框架來裝載另一個資源;屬性值有:_slef:表示自身,默認;_blank:新窗口;_top:頂層框架;_parent:父框架;:標(biāo)簽為頁面上的所有鏈接指定默認地址或默認目標(biāo);必須位于 標(biāo)簽之間;標(biāo)簽還可以發(fā)送郵件:聯(lián)系我四大美女西施昭君貂蟬玉環(huán)4.5 列表相關(guān)標(biāo)簽unorder list:定義無序列表;該元素只能包含 list item

11、子標(biāo)簽;type屬性:可指定列表項目符號類型,屬性值有:disc:表示實心圓點; square:表示空心圓圈; circle:表示實現(xiàn)方塊;order list:定義有序列表;該元素只能包含子標(biāo)簽;type屬性:可指定列表項目序號類型,屬性值有:A:表示使用大寫英文字母作為序號;如A、B、C 等;a:表示使用小寫英文字母作為序號;如a、b、c 等;I:表示使用大寫羅馬數(shù)字作為序號;如I、II、III 等;i:表示使用小寫羅馬數(shù)字作為序號;如i、ii、iii 等;1:表示使用阿拉伯?dāng)?shù)字作為序號;如1、2、3 等;start屬性:可表示列表的起始序號;:定義列表項目,該標(biāo)簽可以包含多種子元素;如三

12、國演義:用于定義列表;該標(biāo)簽只能有,兩種子標(biāo)簽;:定義列表項的標(biāo)題;:定義普通列表項; 4.6 圖片相關(guān)標(biāo)簽:用于向網(wǎng)頁中嵌入一張圖片;請注意,從技術(shù)上講 標(biāo)簽并不會在網(wǎng)頁中插入圖像,而是從網(wǎng)頁上鏈接圖像。 標(biāo)簽有兩個必需的屬性：src和alt:src:該屬性指定顯示圖片文件所在位置;alt:該屬性指定一段文本,可用于當(dāng)圖片不能顯示時顯示的提示信息;height:指定圖片高度,可是像素值或百分比;width:指定圖片寬度,可是像素值或百分比;:創(chuàng)建圖像地圖:指帶有可點擊區(qū)域的一幅圖像做圖片超鏈接;姓名性別年齡電話地址郵箱張三男18110廣州zhang520莉莉女19119成都lili5 表格相

13、關(guān)標(biāo)簽:用于定義表格,由0或1個子標(biāo)簽,0到1個子標(biāo)簽,0到1個子標(biāo)簽,多個子標(biāo)簽,多個子標(biāo)簽組成;常用的屬性如下:border:指定表格邊框的寬度,默認是0;cellpadding:指定單元格內(nèi)容和單元格邊框的間距,值可是像素或百分比;cellspacing:指定單元格之間的間距,值可是像素或百分比;width:指定表格的寬度,值可是像素或百分比;:用于定義表格的標(biāo)題,必須放在之間;:定義表格行,該標(biāo)簽只能有或子標(biāo)簽;:定義單元格,放在中,表示把一行分成N個單元格;(N取決于N對);常見屬性如下:colspan:指定該單元格跨多少列,屬性值是數(shù)字;rowspan:指定該單元格橫跨的行數(shù);he

14、ight:指定單元格的高度;width:指定單元格的寬度;:定義表格頁眉的單元格;用法和標(biāo)簽一直,只是顯示效果有差別;:定義表格的主體,該標(biāo)簽只能包含子元素;使用標(biāo)簽可以將一個表格分成幾個獨立的部分;可以講表格里的一行或多行合并成一組,以后使用Ajax編程的時候常常需要動態(tài)修改表格的某幾行,此時就得使用標(biāo)簽了;:定義表格頭,用法和一致,功能有點差別;:定義表格腳,用法和一致,功能有點差別;,標(biāo)簽可以對表格的行進行分組,每對就是一組;除此之外,當(dāng)創(chuàng)建某個表格時.希望擁有一個標(biāo)題行,以及底部的一個統(tǒng)計行;當(dāng)打印表格式,表格頭和表格腳的數(shù)據(jù)也會包含在數(shù)據(jù)的頁面上;無論,三者的先后順序如何,頁面上總會

15、是最上面顯示表格頭,中間是顯示表格體,最下面顯示表格腳數(shù)據(jù);一般開發(fā)中建議從上到下的順序是:,;好處是即使網(wǎng)速慢沒有加載出表格體的數(shù)據(jù),但是表格頭和表格腳的信息會先顯示出來,以”安撫民心”.6 表單標(biāo)簽:用于生成輸入表單,該標(biāo)簽不可見;在HTML5之前,表單控件,如單行文本框,密碼框,單選框等都必須放在之間;常見屬性如下:action:必填屬性,表示當(dāng)點擊”提交”按鈕時,表單數(shù)據(jù)提交到哪個地址;method:指定表單提交時的請求類型,該屬性值有g(shù)et或post,分別用于GET或POST請求,默認是get方式,開發(fā)建議使用post方式;enctype:指定表單數(shù)據(jù)的編碼方式,屬性有3個值:app

16、lication/x-www-form-urlencoded默認,只處理表單控件里的value屬性值;multipart/form-data以二進制流的方式處理表單數(shù)據(jù),文件上傳時必須使用該屬性值;text/plain不對特殊字符編碼,適合于表單的屬性值為mailto”URL形式,也就是說該方式適用于表單郵件的發(fā)送;get和post這兩種最常用的提交方式的區(qū)別(以后再記)：1. get提交數(shù)據(jù)會顯示在地址欄,對于敏感信息不安全;post提交不顯示在地址欄;2.地址欄中存放的數(shù)據(jù)是有限,所以get方式對提交的數(shù)據(jù)體積有限制;post可以提交大體積數(shù)據(jù);3.對提交數(shù)據(jù)的封裝方式不同： get： 將

17、提交數(shù)據(jù)封裝到了消息的前,請求行中; post：將提交的數(shù)據(jù)封裝到消息頭后,數(shù)據(jù)體中;注意：通常表單使用post提交，因為編碼方便。對于Tomcat服務(wù)器端，默認的解碼方式是ISO8859-1,那么中文會出現(xiàn)亂碼。通過post提交，可以使用request.setCharacterEncoding(“GBK”);來解決亂碼問題，該方法只對數(shù)據(jù)體有效。如果是get提交，request.setCharacterEncoding(“GBK”)該方法對亂碼解決不了,必須先進行ISO8859-1編碼，然后在進行GBK的解碼。這種方式雖然對post提交的亂碼也通用,但是麻煩,建議表單提交使用post。inp

18、ut標(biāo)簽:表單控件標(biāo)簽里功能最豐富的,用于接收用戶輸入的信息;其中的type屬性指定輸入標(biāo)簽的類型。單行文本框:type = text,輸入的文本信息直接顯示在框中;密碼輸入框:type = password,輸入的文本以圓點形式顯示;單選框:type = radio,如：性別選擇;復(fù)選框:type = checkbox,如：多個興趣選擇;隱藏域:type = hidden, 在頁面上不可見,但在提交的時候會一起提交數(shù)據(jù),用于隱式向后臺傳輸一個數(shù)據(jù);提交按鈕:type = submit,用于提交表單中的數(shù)據(jù)內(nèi)容;重置按鈕:type = reset,將表單中填寫的內(nèi)容均設(shè)置為初始值;無動作按鈕:

19、type = button,可使用javascript為其自定義事件;文件上傳域:type = file,會生成一個文本框和一個瀏覽按鈕;圖像域:type = image, 它可以替代submit按鈕,即圖像提交按鈕。標(biāo)簽其他常見屬性:name:指定input標(biāo)簽的名字,沒有設(shè)置name屬性的標(biāo)簽不能提交數(shù)據(jù);value:指定input標(biāo)簽的初始值;checked:設(shè)置單選框,復(fù)選框的初始狀態(tài)是否選中;disable:設(shè)置input標(biāo)簽加載時禁用此標(biāo)簽;,不能提交到后臺maxlength:文本框輸入最大字符數(shù),屬性值是數(shù)字;readonly:指定文本框內(nèi)值不允許直接修改;label標(biāo)簽:用于在表單標(biāo)簽中定義標(biāo)簽,可對表單控件進行提示說明;使用的作用是:當(dāng)用戶點擊所包含的文本時,該標(biāo)簽關(guān)聯(lián)的表單控件就會獲得焦點;讓標(biāo)簽和表單控件相關(guān)聯(lián)的兩種方式