HTML靜態(tài)網(wǎng)頁(yè)知識(shí)點(diǎn)

1、./default.htmldefault :缺省的意思Browser瀏覽器；Client客戶端；Server服務(wù)器文中的XXX “黃色”標(biāo)記為易錯(cuò)的，重要的第一章網(wǎng)頁(yè)編程基礎(chǔ)1、互聯(lián)網(wǎng)？2、分別解釋 tcp/ip; ;ftp;html;bbs;url;php ; css3、url的5種形式？4、服務(wù)器、服務(wù)端？客戶端？5、超文本？超？6、網(wǎng)頁(yè)的3種基本類型？7、一個(gè)完整的hml文件結(jié)構(gòu)有多少個(gè)標(biāo)記？分別是？8、文字的屬性代碼？9、注釋標(biāo)記？標(biāo)題標(biāo)記？換行？空格？段落？加粗？加斜？10、meta標(biāo)記常用的刷新/語(yǔ)言編碼代碼？增加的：關(guān)鍵字、主題容、強(qiáng)行的調(diào)用網(wǎng)上最新版本、文檔作者11、link

2、 標(biāo)記？（）12、base標(biāo)記？（文檔原始地址）13、常見(jiàn)的html編輯器？答案：1、Internet2、tcp/ip:傳輸控制協(xié)議:超文本傳輸協(xié)議ftp:文件傳輸協(xié)議html:超文本標(biāo)記語(yǔ)言bbs:電子公告板服務(wù):W world wide web ）網(wǎng)維網(wǎng)或全球圍網(wǎng)url:統(tǒng)一資源定位符php:一種用來(lái)制作動(dòng)態(tài)網(wǎng)頁(yè)的服務(wù)器端的腳本語(yǔ)言css層疊樣式表（樣式表）一種設(shè)計(jì)網(wǎng)頁(yè)樣式的標(biāo)準(zhǔn)3、file:文件地址（最后以單個(gè)文件結(jié)尾） ,4、server； client【B-B;C-C;B-C模式 B代表企業(yè)；C代表個(gè)人；B/S; C/S5、HT(hyper txet) , HL( hyper lin

3、k)6、靜態(tài)網(wǎng)頁(yè) html ; css 動(dòng)態(tài)網(wǎng)頁(yè) *.jsp, *.php *.asp(以do?開(kāi)始的是Java平臺(tái)編寫(xiě)的) 交互式網(wǎng)頁(yè) JavaScript7、4 個(gè)；分別是 8、文字 9、注釋 ;標(biāo)題：x 為 16,其中 h1 最大;換行：或 空格：段落;力口粗 ;力口斜 10、刷新：meta-equiv= refresh content=時(shí)間；網(wǎng)頁(yè)地址文字編碼：(簡(jiǎn)體中文：gb2312, utf-8是英語(yǔ)編碼，繁體字編碼：BIG5)關(guān)鍵字： 主題容： 強(qiáng)行調(diào)用網(wǎng)上的最新版本：mata-equiv= pragma content= no-cache”或文檔11、12、（注意 XX 與 ad

4、dress 之間是空格。）13、常見(jiàn)的 html 編輯器：Dreamweaver、 Notepad+、 first page 2006、 we builder 2006（以前的 Dreamweaver 是 macromedia 公司的，現(xiàn)在隸屬于 adobe 公司）第二章認(rèn)識(shí)Dreamweaver1、?分支？ xhtml前的x表示什么？在Dreamweaver中什么鍵可實(shí)現(xiàn)預(yù)覽功能？2、重做的快捷鍵？撤銷的快捷鍵？打開(kāi)時(shí)間軸的快捷鍵？目標(biāo)地址？3、在a href=#點(diǎn)擊這里/a中的#表示什么？4、在表格中，填充的含義是什么？間距指的是什么？答案：1、link, subject, x表示此網(wǎng)頁(yè)符

5、合 web2.0的標(biāo)準(zhǔn)，F(xiàn)122、ctrl+Y, Ctrl+Z, Alt+F9, target3、表示空(或者的地址)4、填充的含義是：容到邊框的值，間距(cellspacing):指單元格間的距離。第二章 文字 超 圖片 10.22 Wednesday, October 28, 20091、單行顯示、強(qiáng)制不換行標(biāo)記？2、居中顯示標(biāo)記？段落縮進(jìn)標(biāo)記？原版顯示標(biāo)記？3、段落位置，段落居中，居左，居右？4、水平分隔線的所有屬性？5、文字格式標(biāo)記，屬性？文字的附加屬性：常用的有：b加粗/b、i加斜/i、u加下劃線/u、s加刪除線/s 只需了解的有：small縮小/small、big加大一點(diǎn)/big、

6、strong 力口強(qiáng)強(qiáng)調(diào) /strong、em 強(qiáng)調(diào) /em、；address顯示網(wǎng)址、/address、code顯示代碼指令 /code6、滾動(dòng)字幕、圖片的所有屬性代碼？答案：1、nobr/nobr2、居中：center/center 段落縮進(jìn)：blockquote/blockquote 原版顯示標(biāo)記：pre/pre 或 xmp/xmppre/pre可解析代碼地完全顯示區(qū)別：1xmp/xmp不可解析代碼，絕對(duì)地原版顯示3、p align=center/left/right /p4、 hr color= width= size= align=left/right/center “ noshad

7、e=noshade hr為單標(biāo)簽，若該屬性中不設(shè)noshade,則默認(rèn)為有陰影。5、容 6、滾動(dòng)字幕：滾動(dòng)字幕滾動(dòng)圖片（與滾動(dòng)字幕類似）滾動(dòng)圖片地址：Friday 容1、寫(xiě)出背景的所有屬性：（顏色、圖片 ：平鋪xy, x、v、居中、居右、居左，txet, link, alink, vlink）2、在滾動(dòng)字幕中，設(shè)置鼠標(biāo)移上去停止，移開(kāi)后開(kāi)始的命令。3、常用特殊符號(hào)：千分號(hào)，,&,空格，錢幣符號(hào)，平方，立方 m3。4、上標(biāo)，下標(biāo)5、超格式。（包括在新窗口打開(kāi)/在上一級(jí)打開(kāi)/在自身打開(kāi)覆蓋原來(lái)的網(wǎng)頁(yè) /在整個(gè)窗口打開(kāi)）。6、在相對(duì)路徑中當(dāng)前目錄和上級(jí)目錄分別用什么表示？7、外部（設(shè)置一個(gè)打開(kāi)學(xué)校的

8、服務(wù)器）（思考：若要訪問(wèn)：開(kāi)發(fā) 15班公用/參考頁(yè)面/07.jpg直接編代碼，怎么編？）8、錨點(diǎn)的語(yǔ)法代碼？9、常用的網(wǎng)頁(yè)圖片的格式？分別支持？種色彩，分別解釋10、插入圖片的代碼？（包括圖像寬高，邊框，水平/垂直空白，文字相對(duì)于圖片基線的位置）（知識(shí)點(diǎn)：基線：baseline;寬，高只設(shè)一個(gè)，默認(rèn)等比例放大，縮??；若同時(shí)設(shè)置寬高，圖片就會(huì)變形。） 11、圖片的超級(jí)代碼？12、熱點(diǎn)區(qū)域 （:shape.rectc/cricle/polyroods,href） 完全的格式13、圖片的優(yōu)化：低分辨率顯示：lowsrc 文字替代圖片：alt/tilte 14、外部超級(jí)（www 型，ftp 型，tel

9、net 型，news 型 mailto 型）答案：1、2、在命令里面增加：onmouseover=stop（） onmouseout=start（）3、千分號(hào)o；左尖括號(hào):地址符 &: & 引號(hào)： 空格：錢幣符號(hào) ： 平方 M2： m3: 4、上標(biāo)：下標(biāo)：5、6、當(dāng)前目錄：./ 上級(jí)目錄：./7、點(diǎn)擊到學(xué)校服務(wù)器 （思考題：點(diǎn)擊這里打開(kāi) 07.jpg ）8、錨點(diǎn) 點(diǎn)擊錨點(diǎn)后顯示的容9、gif:圖像交換格式，無(wú)損壓縮圖片格式，支持 256種色，jpg:聯(lián)合照片專家組，有損壓縮圖片格式，支持 1670萬(wàn)種色10、11、12、 , ”一，一容 13、低分辨率：lowsrc 文字替代圖片：14、.Si

10、na.（網(wǎng)址）ftp:/192. HYPERLINK ftp:/wish ftp:/wish mailto:XXX163.?subject=主題&*=抄送地址&bcc=暗送收件人&body=主題”單標(biāo)簽總結(jié):水平分隔線：、插入圖片標(biāo)記：、換行標(biāo)記或不換行標(biāo)記：居中：center、區(qū)域：下劃線：underline簡(jiǎn)稱u圖像文件夾：image10.22作業(yè)：1、建立站點(diǎn)，管理站點(diǎn)。2、制作AP-DIV,漂浮的圖片或flash o其他資訊考試在人事局考試計(jì)算機(jī)職稱，程序員中級(jí)，高級(jí)對(duì)工作有保障 第四章列表與表格 (所有容)1、有序列表(ordered list)標(biāo)記？改變序號(hào)標(biāo)記？有多少種類？指定序

11、號(hào)標(biāo)記？列表項(xiàng)(list item)標(biāo)記？詳解：有序列表,改變序號(hào)標(biāo)記：type有5種(1/a/A/i / I)、指定序號(hào)標(biāo)記：strat=列表項(xiàng)：完整的格式為：2、無(wú)序列表(unordered list )標(biāo)記？更改標(biāo)記樣式？其他無(wú)序列表？詳解：無(wú)序列表 ,更改標(biāo)記樣式：type,其他無(wú)序列表：;前兩者差不多，靠左完整的格式：- - 3、定義列表(definition list )標(biāo)記？定義術(shù)語(yǔ)(definition term )即標(biāo)題？定義說(shuō)明(definition Description )即容詳解：定義列表：,定義術(shù)語(yǔ)： ,定義容：4、表格的3個(gè)標(biāo)記？表格的所有屬性表格邊框的屬性：（外

12、/邊框粗細(xì)，文字到邊框的距離）？邊框顏色？表格邊框的顯示狀態(tài)（上、下、左、右、上下、左右、顯示整個(gè)、整個(gè)不顯示）表格寬、高（單 位為像素px和百分比）表格顏色？表格的水平位置（左、中、右）分隔線的顯示狀態(tài)（顯示所有、 組與組、行與行、列與列、不顯示所有）詳解：3個(gè)標(biāo)記是：表格 行 列表格的所有屬性代碼：XXXXXX5、表格行的屬性（單行高度、邊框顏色、背景顏色、單行文字的水平對(duì)齊方式左、中、右卜單行的垂直位置上、中、下） 詳解：表格行的屬性代碼：XXXX6、單元格屬性（單元格的寬、邊框顏色、背景顏色、單元格文字的水平位置（左、中、右）/垂直位置（上、中、下）詳解：?jiǎn)卧窦矗校傩源a：文字

13、7、標(biāo)題標(biāo)記與屬性，表標(biāo)題標(biāo)記詳解： 標(biāo)題標(biāo)記： 表標(biāo)題標(biāo)記：8、單元格的合并（合并行/列）詳解：合并行/歹U:rowspan/colspan均用在標(biāo)簽中。英語(yǔ)角：Menu :菜單， column :歹U,row ：行 cell：?jiǎn)卧?，layout:布局第五章表單與框架（重點(diǎn)）1、表單標(biāo)記？主要有幾個(gè)屬性？完整的格式？2、輸入元素有？包含的所有？共9個(gè)屬性全部寫(xiě)出來(lái)。3、多行文本標(biāo)記？解釋 wrap ?4、下拉選框的所有屬性？答案：;主要有 3 個(gè)屬性：action , method , name 和不常見(jiàn)的 onsubmit 完整的格式為：.：2、輸入元素：input標(biāo)記包含10個(gè)屬性：

14、本框：密碼： 單選按鈕，單選框：提交：重置：多選按鈕，復(fù)選框：按鈕：圖片按鈕：隱藏域：10、打開(kāi)、上傳文件 實(shí)例：制作如下按鈕：要求如圖：解答:請(qǐng)先在第一個(gè)框中輸入字符點(diǎn)擊輸入，然后點(diǎn)輸出，輸出框就會(huì)顯示你剛才輸?shù)淖址斎胪暾拇a如下:請(qǐng)先在第一個(gè)框中輸入字符，點(diǎn)擊輸入，然后點(diǎn)輸出，輸出框就會(huì)顯示你剛才輸?shù)淖址?3、多行文本標(biāo)記：textarea 其屬性為： name,cols,rows,wrap , value其完整的格式為： 默認(rèn)時(shí)顯示的字詳解：wrap:容超出文本右邊界日的顯示方式。wrap的值有3種：off （永久不換行）/virtual（自動(dòng)換行，在提交數(shù)據(jù)的時(shí)候自動(dòng)換彳T的地方?jīng)]

15、有換行符physical （自動(dòng)換行在提交數(shù)據(jù)時(shí)，換行符一起提交）4、下拉選框 select name=：框名字size=xmultiple= y詳解：x為要顯示的項(xiàng)目數(shù)，y為允許選擇多行、允許列表項(xiàng)目被多選的項(xiàng)數(shù)：取值圍為：（0, +8）框架frame框架集，框式支架：framesetFrameset標(biāo)記的屬性：f frameborder邊框的顯示：0:無(wú)，1:有border邊框粗細(xì)：默認(rèn)為 5px,單位：px （像素）bordercolor邊框顏色：cols:rows： J均用“像素”和“百分比”分割，用“ *”表示剩下的。framespacing ：框架與框架間的間距I noresize

16、：設(shè)定框架不能調(diào)節(jié)，只要設(shè)定了前面，后面將繼承?！究歼^(guò)】詳解：窗口框架： 不能與 body 混用。水平分割：rows, eg:frameset rows= 30%,*“ 其中單位為 px或百分比（即占總窗口的百分比）垂直分害 U: cols, eg:i框架邊框：border=x, x只能以px為單位，邊框隱藏：frameborder= 0,可設(shè)置為：0,1 0為無(wú)，1 為有，不設(shè)則默認(rèn)為有。它也可以用在 中，對(duì)單個(gè)框架有效，F(xiàn)rame標(biāo)記的屬性：Src： frame其作用是顯示網(wǎng)頁(yè)，用 src設(shè)置。，Scrolling=yes/no”有/無(wú)滾動(dòng)條。若不設(shè)，則默認(rèn)為“ auto自動(dòng)”。I Nam

17、e:窗口名稱。Iframe標(biāo)記屬性：N Name:名字Width :寬度Height:高度-Bgcolor：浮動(dòng)窗口的背景顏色Align : （left/right/ middle ）水平對(duì)齊方式Valign： （top/middle/bottom）垂直對(duì)齊方式、Scrolling：（滾動(dòng)條）在這里也可以用英語(yǔ)角動(dòng)作：action 水平的：horizontal表單，形狀：form垂直的：vertical方法：method框架（集）：frame （set）css樣式表 （重點(diǎn)）文中“ _”表示空格Css概念：全稱：Cascading style sheet （層疊樣式表）所謂樣式，就是網(wǎng)頁(yè)里顯示

18、圖片文字的方式（文 字的顏色、背景等）；層疊指當(dāng)cs定義的樣式發(fā)生沖突時(shí)，將據(jù)層的先后來(lái)處理網(wǎng)頁(yè)的容。獨(dú)立網(wǎng)頁(yè)的樣式，方便批量管理。Cs樣式用于控制頁(yè)面的顯示、頁(yè)面的布局。二、 調(diào)用css的4種方式：嵌入式：寫(xiě)在應(yīng)用樣式（即HTML標(biāo)記中）的標(biāo)簽中， 格式為： 文字 或這是 span 標(biāo)t己 外聯(lián)（外部樣式表）：調(diào)一個(gè)外部的cs文檔，其外部寫(xiě)在里面。格式為： 聯(lián)式：把寫(xiě)在標(biāo)記的， eg：* margin:。;Padding:。； Pbgcolor:red;font-size:20px; 導(dǎo)入式： import url（XX.css）;區(qū)別：y卜聯(lián)（瀏覽時(shí)它是與網(wǎng)頁(yè)同步運(yùn)行，常用）1導(dǎo)入式（與頁(yè)

19、面一起加載，當(dāng)網(wǎng)速較慢時(shí)，可能顯示不完全 HTML代碼，導(dǎo)致白屏。） 外聯(lián)的優(yōu)點(diǎn)： 獨(dú)立于html文件，便于修改。I 多個(gè)html文件可以引用一個(gè)樣式表，保持了頁(yè)面外觀的一致性。1 樣式表文件只需下載一次，就可以讓其他到本樣式表的頁(yè)面使用。l 瀏覽器會(huì)先顯示html的容，然后再根據(jù)樣式表文件進(jìn)行渲染，讓訪問(wèn)者更快的 看到網(wǎng)頁(yè)的容。選擇符：（符合就近原則）HTML選擇符（標(biāo)簽選擇器）：eg: p, a, img, tr, td, table, body 等，其格式為：p, a, img, tr, td, table, body。類選擇器：以“.”開(kāi)頭的，用class=調(diào)用，class可以在標(biāo)簽里

20、可寫(xiě)屬性的任何地方使用。Eg： .a .b .tr .td等ID選擇器：以#開(kāi)頭的，用id=調(diào)用。包含選擇器：（其優(yōu)先級(jí)高于 HTML選擇符）eg： XX,XX在td里面，則為td p分組選擇器：eg： p, hx, tr, td, .xx 則為：p,hx,tr,td,.xx通配符選擇器：*【多個(gè)對(duì)象的通用樣式】單位：相對(duì)：px , em絕對(duì)：pt（點(diǎn)數(shù)，是反基本的顯示單位 ），in（不是國(guó)際標(biāo)準(zhǔn)單位，少用），（cm, mm）國(guó)際標(biāo)準(zhǔn)單位 pc:印刷（1pc=12pt）顏色:命名顏色，在此定義下，只有16種顏色能被瀏覽器識(shí)別。eg： pcolor:blue;RGB顏色每種單色的取值圍為：025

21、5 eg： Pcolor:rgb（0,0,0）; 16 進(jìn)制顏色：eg: pcolor:#ff0000;文本屬性：文字字體：font-family （1到多種字體名稱，用，隔開(kāi)）首行縮進(jìn)：text-indent（后跟數(shù)值，單位：px/em）水平對(duì)齊方式：text-align （left、right、center、justify 分散對(duì)齊）垂直對(duì)齊方式： vertical-align （基線： baseline、上：top、中： middle、下：bottom、上標(biāo)： super、下標(biāo)： sub）字符間距常指字母間距：letter-spacing （跟數(shù)值；為加寬，”-“為縮緊） 文字間品巨：w

22、ord-spacing;段落行距：line-height （跟數(shù)值，px）字體效果：font-style （正常：normal ,斜體：Italic,歪斜體：oblique）字體粗細(xì)：font-weight （正常：normal,粗：bold ,更粗：bolder,更細(xì)：lighter, 100-900px （100, 200, 300.900,數(shù)字越大字體越粗）字體大小：font-size （數(shù)值，xx-small, small, medium :標(biāo)準(zhǔn),large, x-large, xx-large） （11）文字裝飾效果，none（正常顯示），underline（下劃線），overlin

23、e（上劃線），linethrough（刪除線），blink（文字閃爍） 英文大小寫(xiě)轉(zhuǎn)換;text-transform【none/capitalize（每個(gè)單詞首寫(xiě)字母轉(zhuǎn)換為大寫(xiě)）/uppercase（全部轉(zhuǎn)換為大寫(xiě)）/lowercase（全部轉(zhuǎn)換為小寫(xiě)）】關(guān)于文本屬性的具體代碼：bodyfont-family:宋體”,X,XX,XX,sans-self;注意你要選擇的字體為宋體，所以要引到起）.atext-indent:XXpx;text-align:left/center/left/justify;color:#XXX; .btext-decoration:none/underline/ov

24、erline/linethrough/blink（閃爍）;text-transform:none/capitalize/uppercase/lowercase;.cvertical-align:baseline/top/middle/bottom/supper/sub;.dletter-spacing:+XX/-XX;line-height:XXpx;.efont-style:normal（正常）/italic（斜）/oblique（歪斜）;font-weight:normal/bold/bolder/lighter/（100900 九級(jí) 力font-size:數(shù)值 /xx-small/x-s

25、mall/small/medium（ 標(biāo)準(zhǔn)）/large/x-large/xx-large 世界你好 八、 列表屬性：有3個(gè)（圖像image、類型style、位置position ）統(tǒng)一或者混合設(shè)置： list-style:XX_XX_XX列表圖像符號(hào)/標(biāo)記：list-style-image:（url）或none 列表符號(hào)類型：list-style-type: （decimal ：阿拉伯?dāng)?shù)字、小寫(xiě)羅馬字：lower-roman、大寫(xiě)羅馬字：upper-roman, 小寫(xiě)英文：lower-alpha,大寫(xiě)英文： upper-alpha）列表符號(hào)位置：list-style-position;（in

26、side/outside）列表屬性cs代碼具體是：/*直接就是組合的寫(xiě)法*/#alist-style:none/url（XX.jpg） _outside _upper-roman ;color:#XXXX;/*代碼中的;“二”分別表示不同類的屬性隔開(kāi)，和相同類的隔開(kāi) */九、模塊邊框的屬性：分為 3大類：margin外邊界、border邊框、padding邊界（邊框到容的距離）Border-collapse:相鄰的邊框，是否合并顯示。（separate：獨(dú)立顯示、collapse：合并顯示）Border-top-width:Border-right-width:Boder-width Bord

27、er-bottom-width:其中 border-width 后面可跟（邊框的寬） Border-left-width:數(shù)值/thin（細(xì)）/medium（中等）/thick（粗） Borderborder-top-color:（邊框?qū)挾龋?（邊框顏色）border-right-color:border-color border-bottom-color:border-left-color:I（邊框線型）b border-top-style:其中邊框線型有：none/實(shí)線:solid /border-style border-bottom-style:小點(diǎn)虛線：dotted/ 大點(diǎn)虛線：da

28、shed/雙直線：doubleborder-left-style:3D 凹線:grve/3D 凸線：ridge/border-right-style:3D 陷入線：inset/ 3D 突出線：outsete.g1.: #1border-width:50px;border-color:red;boeder-style:none;e.g2.： 按 border-width, border-color,border-style的順序，設(shè)置屬性，中間用 _隔開(kāi):#2border:5px_red_solid;若要加其他屬性則用“；”隔開(kāi)。 margin后面跟數(shù)值（px）,表示模塊與其他組件間的空白距離m

29、argin（外邊界）后面跟pxD Padding盒子模型：廠 margin-top:上* margin-right:右 margin-bottom:下 margin-left:左p padding-top: padding-bottom:padding-left:i padding-right:l 統(tǒng)一設(shè)： margin:XXpx;margin:apx_bpx_cpx_dpx;貝順序?yàn)椋荷?、右、下、?j margin:mpx_auto;則為上下均為 mpx, 左右 自動(dòng)。設(shè)置與margin類似:統(tǒng)一設(shè)上右下左1上下，左右content:容 padding:容和邊框之間的距離（上、右、下、左）

30、border:邊框（border-width:邊框粗細(xì)、border-color:邊框顏色、border-style:邊框樣式）margin:盒子與盒子之間的距離（兩個(gè)相鄰的盒子都設(shè)置了該屬性的時(shí)候，取較大的）十、 背景屬性：背景顏色：background-color 其格式為：background-color:#00000 或顏色名稱；背景圖片：background-image 其格式為：background-image:url（路徑）；背景圖片并排設(shè)置：repeat（repeat /repeat-y/ no-repeat/repeat）背景圖片位置定位：position :X,Y對(duì)應(yīng)英文或

31、百分比。格式為： background -position : XX_XX; background-attachment:背景圖片是否固定（屬性值為fixed的時(shí)候，背景圖片固定不動(dòng)）其坐標(biāo)為：左上中上 0%A 50%0%L +x右上*100%左中 no/ZH 1 | 0%上 cnoz+yFJ_L十 50%七I T 100%左卜0 0%中1石卜5 50% 100%0%top-left0%0%/u規(guī) 律規(guī)律.top-center top-right50%3“l(fā)eft-center050%0center-center50%503right-center100%10050bottom-left100% 】3“bottom-center100%bottom-right偽類和span行標(biāo)記偽類有 a:link;/a:visited;/a