版權(quán)說明:本文檔由用戶提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)
文檔簡(jiǎn)介
實(shí)驗(yàn)指導(dǎo)13:表格框架表單CSS綜合練習(xí)【實(shí)驗(yàn)?zāi)康暮鸵蟆浚簯?yīng)用表格制作網(wǎng)頁掌握框架組織網(wǎng)頁的方法掌握表單網(wǎng)頁的制作。利用CSS樣式統(tǒng)一多張網(wǎng)頁?!緦?shí)驗(yàn)內(nèi)容】:實(shí)驗(yàn)一:制作“樣式”。實(shí)驗(yàn)二:制作“寧波旅游”網(wǎng)頁。實(shí)驗(yàn)三:制作“溪口景區(qū)”網(wǎng)頁。實(shí)驗(yàn)四:制作“石浦景區(qū)”網(wǎng)頁。實(shí)驗(yàn)五:制作“四明山景區(qū)”網(wǎng)頁。實(shí)驗(yàn)六:制作“景區(qū)列表”網(wǎng)頁。實(shí)驗(yàn)七:制作“網(wǎng)站注冊(cè)”網(wǎng)頁。實(shí)驗(yàn)八:制作“寧波旅游主頁”網(wǎng)頁?!緦?shí)驗(yàn)工具】記事本和IE瀏覽器【實(shí)驗(yàn)類型】設(shè)計(jì)【實(shí)驗(yàn)步驟】:實(shí)驗(yàn)一:制作“樣式”網(wǎng)頁。新建樣式表文件,保存為a.css。網(wǎng)頁的背景為bg.jpg定義圖片img大小為寬420px,高240px。定義段落P的文本首行縮進(jìn)2em,字體大小為large,顏色為紫色purple。定義文檔中的超鏈接在未點(diǎn)擊時(shí)(a:link)沒有下劃線,顏色為黃色;鼠標(biāo)懸停時(shí)(a:hover)超鏈接顏色為藍(lán)色blue;點(diǎn)擊過后(a:visited)有下劃線,且顏色變?yōu)榧t色red。實(shí)驗(yàn)二:制作“寧波旅游”網(wǎng)頁。制作網(wǎng)頁并保存為nbly.html。頁面的標(biāo)題設(shè)置為“寧波旅游”,頁面的背景顏色為#8cff8c;頁面上的文字“寧波旅游”大小為7號(hào),加粗居中顯示,每?jī)蓚€(gè)字之間空兩個(gè)空格;文字“點(diǎn)擊注冊(cè)旅游社區(qū)”滾動(dòng)顯示,隸書顯示,字體大小為5號(hào);實(shí)驗(yàn)三:制作“溪口景區(qū)”網(wǎng)頁。制作網(wǎng)頁并保存為xikou.html。網(wǎng)頁的標(biāo)題為“溪口景區(qū)”。頁面中插入圖片xikou.jpg,文字(在文字資料文檔中給出)在圖片右側(cè)環(huán)繞。鏈接外部樣式表a.css,讓網(wǎng)頁中的內(nèi)容顯示如圖所示的效果。實(shí)驗(yàn)四:制作“石浦景區(qū)”網(wǎng)頁。制作網(wǎng)頁并保存為shipu.html。網(wǎng)頁的標(biāo)題為“石浦景區(qū)”。頁面中插入圖片shipu.jpg,文字(在文字資料文檔中給出)在圖片左側(cè)環(huán)繞。鏈接外部樣式表a.css,讓網(wǎng)頁中的內(nèi)容顯示如圖所示的效果。實(shí)驗(yàn)五:制作“四明山景區(qū)”網(wǎng)頁。制作網(wǎng)頁并保存為simingshan.html。網(wǎng)頁的標(biāo)題為“四明山景區(qū)”。頁面中插入圖片simingshan.jpg,文字(在文字資料文檔中給出)在圖片右側(cè)環(huán)繞。鏈接外部樣式表a.css,讓網(wǎng)頁中的內(nèi)容顯示如圖所示的效果。實(shí)驗(yàn)六:制作“景區(qū)列表”網(wǎng)頁。制作網(wǎng)頁并保存為liebiao.html。網(wǎng)頁的標(biāo)題為“景區(qū)列表”。頁面的背景圖片為bg1.jpg,頁面上文字“主要景區(qū)介紹:”字體大小為6號(hào),顏色為黃色yellow;頁面上的文字“溪口景區(qū)”、“石浦景區(qū)”和“四明山景區(qū)”采用無序列表方式排列,且每項(xiàng)前的符號(hào)為空心圓,項(xiàng)之間空一行。文字“聯(lián)系我們”是郵件鏈接,點(diǎn)擊后打開Outlook,收件人地址為dhy@。鏈接外部樣式表a.css,讓網(wǎng)頁中的內(nèi)容顯示如圖所示的效果。實(shí)驗(yàn)七:制作“網(wǎng)站注冊(cè)”網(wǎng)頁。制作網(wǎng)頁并保存為biaodan.html。網(wǎng)頁的背景圖片為bg.jpg“歡迎注冊(cè)寧波旅游社區(qū)”設(shè)置為一級(jí)標(biāo)題,居中顯示。利用表格進(jìn)行表單的排版:表格居中對(duì)齊,表格背景顏色為#bbffbb,邊框?yàn)榧t色,插入7行2列的表格,表格邊框?yàn)?像素,寬度380像素,單元格間距為2,單元格與內(nèi)容的間距為5。表格內(nèi)容,如圖所示。第1列右對(duì)齊,寬度120像素,第2列左對(duì)齊,寬度260像素。用戶名文本框,寬度為16像素,可以輸入最多20個(gè)半角字符。性別為單選項(xiàng),初始時(shí)“女”被選中。出生年月日為三個(gè)文本框,年,默認(rèn)顯示“19”,寬度為4像素,可以輸入最多4個(gè)半角字符。月日文本框?qū)挾葹?像素,可以輸入最多2個(gè)半角字符。(3分)學(xué)歷為下拉列表,列出四個(gè)選項(xiàng):大專,本科,碩士,博士。喜歡的旅游類型為多選項(xiàng)。旅游宣言:顯示為5行,每行可以顯示20半角字符。最后一行,設(shè)置提交按鈕和重置按鈕。實(shí)驗(yàn)八:制作“寧波旅游主頁”網(wǎng)頁。制作網(wǎng)頁并保存為index.html。網(wǎng)頁的標(biāo)題為“寧波旅游主頁”。利用框架布局,框架邊框?yàn)?,邊框顏色為綠色green,上下框架比例為20%,80%,左右框架比例為22%,78%;上框架載入nbly.html,左下框架載入liebiao.html,右下框架初始載入xikou.html。當(dāng)點(diǎn)擊上框架中的“注冊(cè)旅游社區(qū)”超鏈接時(shí),會(huì)在右下框架中顯示biaodan.html。點(diǎn)擊左下框架上的景區(qū)名稱時(shí),會(huì)在右下框架中顯示相應(yīng)的網(wǎng)頁:當(dāng)點(diǎn)擊“溪口景區(qū)”,會(huì)在右下框架中顯示xikou.html;當(dāng)點(diǎn)擊“石浦景區(qū)”,會(huì)在右下框架中顯示shipu.html;當(dāng)點(diǎn)擊“四明山景區(qū)”,會(huì)
溫馨提示
- 1. 本站所有資源如無特殊說明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
- 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶所有。
- 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒有圖紙預(yù)覽就沒有圖紙。
- 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
- 5. 人人文庫網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
- 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
- 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。
最新文檔
- 2026年中國棉花棉紗交易中心有限責(zé)任公司招聘?jìng)淇碱}庫及參考答案詳解
- 2026年北京通達(dá)物資采購配送中心招聘?jìng)淇碱}庫完整參考答案詳解
- 2026年成都中醫(yī)藥大學(xué)發(fā)展規(guī)劃處“雙一流”建設(shè)辦公招聘行政助理的備考題庫完整答案詳解
- 2025年宣威市格宜鎮(zhèn)公開招聘村級(jí)衛(wèi)生室鄉(xiāng)村醫(yī)生備考題庫及參考答案詳解1套
- 2026年國投生物能源(雞東)有限公司招聘?jìng)淇碱}庫及參考答案詳解1套
- 2026年東山投資集團(tuán)招聘?jìng)淇碱}庫及一套答案詳解
- 2025年巨野縣高鐵北站公開招聘客運(yùn)服務(wù)人員備考題庫完整答案詳解
- 2026年上海長(zhǎng)江輪船有限公司招聘?jìng)淇碱}庫及完整答案詳解1套
- 2026年德陽市人民醫(yī)院第三批人才招聘?jìng)淇碱}庫完整答案詳解
- 2026年安徽省林業(yè)局選聘法律顧問的備考題庫及完整答案詳解1套
- 網(wǎng)絡(luò)傳播法規(guī)(自考14339)復(fù)習(xí)題庫(含答案)
- 民辦學(xué)校退費(fèi)管理制度
- T/CIE 115-2021電子元器件失效機(jī)理、模式及影響分析(FMMEA)通用方法和程序
- KubeBlocks把所有數(shù)據(jù)庫運(yùn)行到K8s上
- 廣東省江門市蓬江區(qū)2025年七年級(jí)上學(xué)期語文期末考試試卷及答案
- 蘇州市施工圖無障礙設(shè)計(jì)專篇參考樣式(試行)2025
- 等腰三角形重難點(diǎn)題型歸納(七大類型)原卷版-2024-2025學(xué)年北師大版八年級(jí)數(shù)學(xué)下冊(cè)重難點(diǎn)題型突破
- 臨時(shí)用電變壓器安裝方案
- 社會(huì)工作項(xiàng)目調(diào)研方案含問卷及訪談提綱
- 2025年包頭職業(yè)技術(shù)學(xué)院?jiǎn)握新殬I(yè)技能測(cè)試題庫完整版
- 全國高校輔導(dǎo)員素質(zhì)能力大賽試題(談心談話、案例分析)
評(píng)論
0/150
提交評(píng)論