【正文】 /tr tr bgcolor=FF9966 th align=left總計(jì) /th th align=right$/th th align=right$/th /tr /table /body /html 作業(yè) 314源代碼 第 42頁(yè) 任務(wù)一 表格的設(shè)計(jì) ● 作業(yè) 315 – 使用 代碼 編寫一個(gè)網(wǎng)頁(yè) ,要求： – 表格居中對(duì)齊，表格邊框?yàn)?1像素，表格的寬度為 470像素； – 第一行使用 th； – 最后一行合并了三列，嵌套了一個(gè)表格，該表格寬度為100%,無(wú)邊框，為一行四列； – 分別使用 thead、 tbody、 tfoot三個(gè)標(biāo)簽設(shè)置表格的顏色，如右下圖所示，顏色可以自己選擇； – 將文件保存為：姓名作業(yè) ，并上交 第 43頁(yè) 任務(wù)一 表格的設(shè)計(jì) %LANGUAGE=VBSCRIPT CODEPAGE=65001% html head meta equiv=ContentType content=text/html。 – border ? 圖像的邊框 ? 可以為圖像添加邊框線，但是邊框的顏色不可以設(shè)置，邊框的顏色為黑色，當(dāng)圖像添加了超鏈接時(shí)，邊框顏色和鏈接文字顏色一致。 /body /html 第 52頁(yè) 任務(wù)二 圖片視頻的插入 ● 插入 flash動(dòng)畫 – 語(yǔ)法： ? embed src=“多媒體文件地址 ” width=“多媒體的寬度 ” heiht=“多媒體的高度 ”/embed 第 53頁(yè) 作業(yè) 322 表格：寬度 995，無(wú)填充 ，無(wú)間距 居中對(duì)齊 圖片：寬度 995，高： 140 swf：寬度 778，高： 250 圖片：寬度 217，高： 559 圖片：寬度 778，高： 81 圖片：寬度 234，高： 194 左對(duì)齊 文字：宋體 字號(hào)： 4 圖片：寬度 985，高： 87 第 54頁(yè) 任務(wù)二 圖片視頻的插入 %LANGUAGE=VBSCRIPT CODEPAGE=65001% head meta equiv=ContentType content=text/html。銷售方面，公司經(jīng)過(guò)多年的探索和創(chuàng)新，開發(fā)出了一套惠及各方利益的市場(chǎng)運(yùn)作方案，建立起了 1100余個(gè)銷售服務(wù)網(wǎng)點(diǎn)，使公司及產(chǎn)品在當(dāng)?shù)囟夹纬闪肆己玫目诒? 圖片視頻的插入總結(jié) img src=“url ” alt border width height align vspace hspace 圖片的插入 img embed src=“url ” /embed width height align vspace hspace 動(dòng)畫和視頻插入embed marquee/marquee Scrollamount Scrolldelay bgcolor width height hspace vspace 滾動(dòng)標(biāo)記 marquee img embed marquee bgsound src=“ 背景音樂(lè)的地址” Loop=“ 循環(huán)次數(shù)” 第 63頁(yè) ●作業(yè) 323 – 使用代碼編寫教材項(xiàng)目三任務(wù)一中的首頁(yè)。鏈接到其他頁(yè)面中的錨點(diǎn)； 第 71頁(yè) 任務(wù)三 超鏈接 ● 錨點(diǎn) 鏈接 – 例題 ? 鏈接到同一頁(yè)面中的錨點(diǎn) – 源文件： 效果文件： e333(ok).asp ? 鏈接到不同頁(yè)面 中的錨點(diǎn) – 源文件： 效果文件： e334(ok).asp 第 72頁(yè) 任務(wù)三 超鏈接 ● 鏈接到外部網(wǎng)站 – 語(yǔ)法： ? a href=“ ● 鏈接到 Email – 語(yǔ)法： ? a href=“mailto:郵箱地址 ”……/a 任務(wù) 五 框架 第 74頁(yè) 任務(wù)五 框架 框架是網(wǎng)頁(yè)設(shè)計(jì)中很常用的技術(shù)，可以在一個(gè)瀏覽器窗口中顯示多個(gè)文檔。 ? 語(yǔ)法 frameset rows=“框架窗口 的高度， 框架窗口 的高度， …..” frame frameset cols=“框架窗口的寬度，框架窗口的寬度 ….” frame frame ……. /frameset /frameset ? 應(yīng)用舉例 第 79頁(yè) 任務(wù)五 框架 – 框架的邊框 frameborder ? 默認(rèn)情況下，瀏覽器總是給每一個(gè)框架結(jié)構(gòu)加上一條有明顯寬度的邊框； ? 通過(guò) frameborder可以控制邊框的顯示和隱藏； ? 取值只能為 0、 1，或者 yes、 no； 0或 no：邊框?qū)?huì)隱藏； 1或 yes：邊框?qū)?huì)顯示。 – 頁(yè)面源文件 src – 浮動(dòng)框架的寬和高 width、 height ? frameset生成的框架結(jié)構(gòu)是依賴上級(jí)空間尺寸的，它的寬度或者高度必須有一個(gè)和上級(jí)框架相同。 ? 一般情況下，表單的處理程序 action和傳送方法 method是必不可少的參數(shù)。 第 95頁(yè) 任務(wù)六 表單 – 目標(biāo)顯示方式 target ? 用于指定目標(biāo)窗口的打開方式，表單的目標(biāo)窗口往往用來(lái)顯示表單的返回信息。 value 用來(lái)定義密碼域的默認(rèn)值，以“ *”顯示 size 確定文本框在頁(yè)面中顯示的長(zhǎng)度，以字符為單位 maxlength 用來(lái)設(shè)置密碼域的文本框中最多可以輸入的字符數(shù) 第 102頁(yè) 任務(wù)六 表單 – 應(yīng)用實(shí)例 ? e363（ ok） .asp 第 103頁(yè) 任務(wù)六 表單 ● 插入 多行 文本字段 textarea 當(dāng)需要讓瀏覽者填入多行文本時(shí)，就需要使用文本域。 – 下拉菜單 select ? 語(yǔ)法 select name=“下拉菜單名稱 ” option value=“選項(xiàng)值 ” selected選項(xiàng)顯示內(nèi)容 /option ……. /select – 選項(xiàng) 值是提交表單時(shí)的值，而選項(xiàng)顯示內(nèi)容才是真正在頁(yè)面中顯示的選項(xiàng)內(nèi)同。 – 語(yǔ)法 ? input type=“checkbox” name=“復(fù)選框名稱 ” value=“復(fù)選框的取值 ” checked=checked/ ? checked參數(shù)表示該項(xiàng)在默認(rèn)情況下已經(jīng)被選中，一個(gè)選項(xiàng)列表中可以有多個(gè)復(fù)選框被選中； 第 108頁(yè) 任務(wù)六 表單 – 應(yīng)用實(shí)例 ? e366（ ok） .asp 第 109頁(yè) 任務(wù)六 表單 ● 插入列表 /菜單 菜單和列表也是表單中常用的元素之一，它可以顯示多個(gè)選項(xiàng)，用戶通過(guò)滾動(dòng)條在多個(gè)選項(xiàng)中選擇。不同的是密碼域輸入的字符全部以“ *”顯示。 第 94頁(yè) 任務(wù)六 表單 – 編碼方式 enctype ? 表 單中的 enctype屬性用于設(shè)置表單信息提交的編碼方式。表單主要用于收集客戶端提供的相關(guān)信息，使網(wǎng)頁(yè)具有交互功能。 ? noframe /noframe ? 例如： frameset …….. /frameset noframe 對(duì)不起，您的瀏覽器不支持框架結(jié)構(gòu)。 ? 應(yīng)用舉例 – cols垂直分割窗口 ? 將頁(yè)面 沿垂直方向分割語(yǔ)法 frameset cols=“框架窗口 的寬度， 框架窗口 的寬度 ， …..” frame frame ……. /frameset ? cols可以取多個(gè)值，它由 逗號(hào) 分割的像素值或百分比組成 。 – 創(chuàng)建命名錨記 ? 語(yǔ)法： – a name=“錨點(diǎn)的名稱 ”/a – 鏈接到命名錨記 ? 語(yǔ)法： – a href=“錨點(diǎn)的名稱 ”……/a 187。如果設(shè)置的時(shí)間比較長(zhǎng)，會(huì)產(chǎn)生走走停停的效果。為了使企業(yè)能夠持續(xù)、健康、穩(wěn)定地發(fā)展，公司將所獲利潤(rùn)的較大部分投入到了產(chǎn)品研發(fā)之中，在自主研發(fā)與合作開發(fā)的理念指導(dǎo)下，與國(guó)內(nèi)眾多大專院校、科研機(jī)構(gòu)及企業(yè)有著密切地交流及技術(shù)往來(lái)，并建立了科研試驗(yàn)基地 160多畝。本山訓(xùn)場(chǎng)是一片布置于樹林及原野間的山訓(xùn)場(chǎng)，場(chǎng)內(nèi)的設(shè)施均具野味而刺激。 ? 語(yǔ)法： img src=“url” alt=“圖像提示文字” 第 48頁(yè) 任務(wù)二 圖片視頻的插入 ● 圖片的插入 – 圖片的顯示 大小 ? img src=“erl“ width=“” height=“” ? width指定圖片的寬度， height指定高度。 charset=utf8 / title作業(yè) 32/title /head body table border=1 tr td rowspan=2阿里巴巴旗下網(wǎng)站 /td td我要買 /td td我要買 /td td我淘寶 /td /tr tr td colspan=3你好，歡迎來(lái)淘寶！ /td /tr /table /body /html 作業(yè) 312源代碼 第 38頁(yè) 跨 2行 ，并放了一副圖片 此單元格放了 一副圖片 此單元格跨了 3列 作業(yè) 313 編寫如下圖所示效果對(duì)應(yīng)的 html代碼 插入圖片： img src=url width=“圖片寬度 ” heigjt=“圖片高度 ” 任務(wù)一 表格的設(shè)計(jì) 第 39頁(yè) 任務(wù)一 表格的設(shè)計(jì) %LANGUAGE=VBSCRIPT CODEPAGE=65001% html head meta equiv=ContentType content=text/html。不過(guò)，如果文本的字號(hào)各不相同，那么 baseline 的效果會(huì)更好 。 第 23頁(yè) 任務(wù)一 表格的設(shè)計(jì) %LANGUAGE=VBSCRIPT CODEPAGE=65001% html head meta equiv=ContentType content=text/html。 第 22頁(yè) 任務(wù)一 表格的設(shè)計(jì) ● 單元格屬性 – width屬性：指定表格或某一個(gè)表格單元格的寬度。 ? 語(yǔ)法： table border=“邊框?qū)挾?” – border屬性設(shè)置的表格邊框職能影響表格四周的邊框?qū)挾?，而不能影響單元格之間的邊框尺寸。 ? 語(yǔ)法： th ……./ th 第 13頁(yè) 任務(wù)一 表格的設(shè)計(jì) html head meta equiv=ContentType content=text/html。 ? td元素：定義表格的一個(gè)單元格 。 第 5頁(yè) 任務(wù)一 表格的設(shè)計(jì) ● 任務(wù)實(shí)施 – 案例 1 表格的設(shè)計(jì) ——主頁(yè)面 設(shè)計(jì) ? 新建頁(yè)面 ? 查看表格屬性面板進(jìn)行表格屬性設(shè)置 ? 插入或刪除行和列 ? 單元格的拆分和合并 第 6頁(yè) 任務(wù)一 表格的設(shè)計(jì) 圖片寬： 204，高： 231 圖片寬： 204，高： 263 圖片寬： 486，高： 263 圖片寬： 204，高： 263 將單元格拆分為 1列 7行 插入內(nèi)嵌表格， 1行 7列 第 7頁(yè) 任務(wù)一 表格的設(shè)計(jì) ● 表格基本概念 表格是網(wǎng)頁(yè)制作中使用最多的工具之一，它不僅可以將相關(guān)數(shù)據(jù)有序的排列起來(lái)，還可以精確地定位文字、圖像等網(wǎng)頁(yè)元素在頁(yè)面中的位置，使得頁(yè)面在形式上豐富多彩又條理清楚，在組織上井然有序又不顯單調(diào)。缺少任何一個(gè)元素，都無(wú)法定義出一個(gè) 表格。 – height屬性：指定表格或某一個(gè)表格單元格的高度。 charset=utf8 / title表格的邊框顏色 /title /head body t