助理電子商務(wù)師 網(wǎng)絡(luò)部分-5-HTM L基礎(chǔ)【實(shí)用資料】

1、1 HTML語(yǔ)言概述 1.1 HTML概述 HTML是Hyper Text Markup Language，超文本標(biāo)記語(yǔ)言的縮寫，用來(lái)表示網(wǎng)上信息的符號(hào)標(biāo)記語(yǔ)言。 HTML最早源于SGML語(yǔ)言 .HTML語(yǔ)言內(nèi)容豐富，從功能上大體可分為：文本結(jié)構(gòu)設(shè)置列表建立文本屬性制定超鏈接圖片和多媒體插入表格以及窗體的操作。 1 HTML語(yǔ)言概述1.2 HTML文檔的結(jié)構(gòu)包括HEAD、TITLE、BODY三局部，下面是根本結(jié)構(gòu)： 標(biāo)題局部 正文局部 1 HTML語(yǔ)言概述1.3 HTML標(biāo)記 1HTML文檔標(biāo)記 格式：標(biāo)志文件開始和結(jié)尾的標(biāo)記。 2HTML文件頭標(biāo)記 格式：用于包含文件的根本信息。 3HTML

2、文件主體標(biāo)記 格式：文件主體標(biāo)記。 注意：與為獨(dú)立的兩個(gè)局部，不能互相嵌套。 1 HTML語(yǔ)言概述1.4 常用HTML編輯工具 任何一個(gè)文檔編輯器都是HTML編輯器。為了減少網(wǎng)頁(yè)設(shè)計(jì)師的工作設(shè)計(jì)了專用的網(wǎng)頁(yè)編輯器，像Dreamweaver、FrontPage、CutePage、QuickSite等，是專門用來(lái)制作網(wǎng)頁(yè)的，具有所見即所得的功能。2 文本的格式與風(fēng)格 2.1 設(shè)置的屬性 1屬性概述 background屬性 bgcolor 屬性bgproperties屬性 link ，vlink， alink屬性Leftmargin，topmargin屬性Margingwidth，marginhe

3、ight屬性2 文本的格式與風(fēng)格2.2 段落格式化 1標(biāo)題標(biāo)記格式：，設(shè)置各種大小不同標(biāo)題的標(biāo)記。2段落標(biāo)記格式：設(shè)置段落標(biāo)記。 2.2 文本的格式與風(fēng)格4分區(qū)顯示標(biāo)記格式：分區(qū)顯示標(biāo)記。5詞標(biāo)記這種標(biāo)記有兩種：和格式：強(qiáng)制進(jìn)行換行標(biāo)記。 格式：插入水平線標(biāo)記。 6注釋標(biāo)記格式：注釋標(biāo)記。 2 文本的格式與風(fēng)格2.4 建立列表 1有序列表格式： 功能：建立有序列表。 2.2 文本的格式與風(fēng)格2無(wú)序列表格式： 功能：建立無(wú)序列表。 2 文本的格式與風(fēng)格2.5 字符的格式化 1字體設(shè)置標(biāo)記格式：功能：設(shè)置字體格式標(biāo)記。標(biāo)記提供了幾種屬性 ：size：設(shè)置文字的大小。face：設(shè)置字體。color：

4、設(shè)置文字的顏色。2 文本的格式與風(fēng)格其他標(biāo)記格式功能給字符加下劃線給字符上加橫線，表示刪除給字符加粗將字符設(shè)置成斜體標(biāo)記使得其中的文字產(chǎn)生閃爍的效果3 參加多媒體與超級(jí)鏈接 3.1 參加圖像 圖像在網(wǎng)頁(yè)設(shè)計(jì)中是必不可少的，所以用戶應(yīng)掌握在網(wǎng)頁(yè)中操作圖像的方法。 格式： 功能：在網(wǎng)頁(yè)中參加圖像、視頻、動(dòng)畫等。 3 參加多媒體與超級(jí)鏈接標(biāo)記屬性功能src =URL通過(guò)URL給出圖像來(lái)源的位置，不可缺省width=size設(shè)置圖像寬度height =size設(shè)置圖像高度alt= txt設(shè)置在圖像未載入前圖片位置顯示的文字border= size設(shè)置圖像邊框，缺省為0align=alignstyle設(shè)

5、置對(duì)齊方式。取值為：top，middle，bottom，aleft，righthspace=size設(shè)置圖片左右邊沿空白vspace=size設(shè)置圖片上下邊沿空白1插入圖像 3 參加多媒體與超級(jí)鏈接3.2 參加超級(jí)鏈接格式： 標(biāo)記屬性功能href=URL給定鏈接目標(biāo)的位置target=frametarget設(shè)置顯示鏈接目標(biāo)的框架accesskey=character設(shè)置快捷鍵tabindex=num設(shè)置Tab鍵的順序rel=linktype設(shè)置到鏈接的關(guān)系4 制作表格 4.1 建立表格創(chuàng)立表格是規(guī)劃頁(yè)面最常用的方法。格式：功能：創(chuàng)立表格進(jìn)行頁(yè)面設(shè)計(jì)。 在瀏覽器中顯示時(shí)，表格的整體外觀由標(biāo)記的屬

6、性決定 。4 制作表格標(biāo)記屬性功能border=size設(shè)置表格邊框大小width= size設(shè)置表格的寬度height=size設(shè)置表格的高度cellspacing=size設(shè)置單元格間距cellpadding =size設(shè)置單元格的填充距background =URL設(shè)置表格背景圖片bgcolor =colorvalue設(shè)置表格背景色align=alignstyle設(shè)置對(duì)齊方式cols =size設(shè)置表格的列數(shù)4 制作表格4.2 定制表格使用只是定義空表格，還需要定義行和單元格。格式：功能：定義表格的一行。對(duì)于每一行，可以定義行屬性 4 制作表格標(biāo)記屬性功能bgcolor=colorval

7、ue設(shè)置行背景顏色。align=alignstyle設(shè)置行對(duì)齊方式。valign=valignstyle設(shè)置單元格垂直對(duì)齊方式。行屬性：4 制作表格單元格屬性：標(biāo)記屬性功能bgcolor=colorvalue設(shè)置單元格背景顏色rowspan=num設(shè)置單元格所占的行數(shù)colspan =num設(shè)置單元格所占的列數(shù)align =alignstyle設(shè)置對(duì)齊方式valign =valignstyle設(shè)置單元格垂直對(duì)齊方式width =size設(shè)置單元格寬度height=size設(shè)置單元格高度5 制作表單 5.1 表單的結(jié)構(gòu) 格式：定義表單。 標(biāo)記屬性功能action= URL設(shè)置處理表單的程序met

8、hod=postmethod設(shè)置發(fā)送表單的HTTP方法enctype=contenttype設(shè)置發(fā)送表單的內(nèi)容屬性onsubmit= script設(shè)置被發(fā)送事件target=frametarget設(shè)置顯示表單內(nèi)容的窗口accept-charset=cdata設(shè)置可支持的字符列表5 制作表單5.2 FORM中常用的標(biāo)記 1輸入域1單行輸入域 1text類型 2password類型 3radio類型 4checkbox類型5submit類型 6reset類型 7hidden類型 5 制作表單2多行輸入域標(biāo)記標(biāo)記屬性功能name=cdata設(shè)置FORM提交的輸入信息的名稱rows=num設(shè)置文本域的

9、行數(shù)cols= num設(shè)置文本域的列數(shù)tabindex=num設(shè)置tab鍵的次序5 制作表單2按鈕 標(biāo)記屬性功能name=cdata設(shè)置已發(fā)送表單的關(guān)鍵字。value=cdata設(shè)置已發(fā)送表單的值。type= buttontype設(shè)置按鈕的類型。tabindex=num設(shè)置tab鍵的次序。6 框架結(jié)構(gòu) 6.1 框架結(jié)構(gòu)的文件格式 注意：在老版本的瀏覽器 可能不支持框架結(jié)構(gòu)。 6 框架結(jié)構(gòu)6.2 框架結(jié)構(gòu)標(biāo)記的使用 格式：標(biāo)記屬性功能rows=size設(shè)置多重框架的高度cols =size設(shè)置多重框架的寬度onload=script設(shè)置框架被載入的事件onunload=script 設(shè)置框架被卸

10、載的事件6 框架結(jié)構(gòu)6.3 FRAME標(biāo)記 標(biāo)記屬性功能src=URL設(shè)置要鏈接到的HTML文件name=framename表示子窗口的名字marginwidth=size用來(lái)控制顯示內(nèi)容和窗口左右邊界的距離，默認(rèn)為1marginheight= size用來(lái)控制顯示內(nèi)容和窗口上下邊界的距離，默認(rèn)為1scrolling=scrollingstyle指定子窗口是否使用滾動(dòng)條，有YES/NO/AUTO三個(gè)值，默認(rèn)AUTO，即根據(jù)窗口內(nèi)容決定是否有滾動(dòng)條noresize使用該屬性后，指定窗口不能調(diào)整窗口大小6 框架結(jié)構(gòu)6.4 TARGET屬性的使用三種常見的用法：1用于A標(biāo)記 2用于BASE標(biāo)記 3用于FORM標(biāo)記 7 CSS根底 7.1 CSS樣式簡(jiǎn)介CSS是Cascading Style Sheet的簡(jiǎn)稱，常譯為“級(jí)聯(lián)樣式表或“層疊格式頁(yè)等。它是HTML技術(shù)的擴(kuò)展，屬于動(dòng)態(tài)HTML的重要內(nèi)容，用于控制HTML標(biāo)記的顯示格式。使用CSS控制格式有兩種方法：在線格式和全局格式