《HTML5 CSS3網站設計基礎》課后答案 朱翠苗_第1頁
《HTML5 CSS3網站設計基礎》課后答案 朱翠苗_第2頁
《HTML5 CSS3網站設計基礎》課后答案 朱翠苗_第3頁
《HTML5 CSS3網站設計基礎》課后答案 朱翠苗_第4頁
《HTML5 CSS3網站設計基礎》課后答案 朱翠苗_第5頁
已閱讀5頁，還剩7頁未讀， 繼續(xù)免費閱讀

下載本文檔

版權說明：本文檔由用戶提供并上傳，收益歸屬內容提供方，若內容存在侵權，請進行舉報或認領

文檔簡介

項目一習題答案一、簡答題簡單介紹HTML5新增的標簽和屬性。答案要點HTML5一些新標簽如header,footer,dialog,aside,figure等，并且增加了一些全新的表單輸入對象，包括日期，URL，Email、地址，其它的對象則增加了對非拉丁字符的支持。簡單介紹HTML5廢棄的標簽和屬性。答案要點1）、能用CSS代替的元素這些元素包含basefont、big、center、font、s、strike、tt、u。2）、frame框架這些元素包含frameset、frame、noframes。HTML5中不支持frame框架，只支持iframe框架，刪除以上這三個標簽。3）、只有部分瀏覽器支持的元素這些元素包含applet、bgsound、blink、marquee等標簽。4）、其他被廢除的元素廢除rb，使用ruby替代，廢除acronym使用abbr替代，廢除dir使用ul替代，廢除isindex使用form與input相結合的方式替代，廢除listing使用pre替代，廢除xmp使用code替代，廢除nextid使用guids，廢除plaintex使用“text/plian”（無格式正文）MIME類型替代。二、編碼寫出HTML5的文檔聲明和語法規(guī)范<!doctypehtml><html><head><metacharset="utf-8"><title>無標題文檔</title></head><body></body></html>項目二習題答案一、判斷正誤HTML標記符的屬性一般不區(qū)分大小寫。（對）網站就是一個鏈接的頁面集合。（對）所有的HTML標記符都包括開始標記符和結束標記符。（錯）用H1標記符修飾的文字通常比用H6標記符修飾的要小（錯）。GIF格式的圖象最多可以顯示256種顏色。（對）二、選擇題html的基本結構是（B）html中，圖片顯示和其懸停提示文字先是分別是（D）以下（ABCD）是html常用的塊狀結構4.在HTML中有效、規(guī)范的注釋申明是（B）三、簡答題1.HTML內容的組織順序是什么？答案要點從頭到尾的加載。<html>標簽<head>代碼和引用區(qū)域</head><body>html內容區(qū)域</body></html>2.請寫出HTML常用的四種塊結構。答案要點A.div-dl-dt-ddB.div-ul-liC.div-ol-liD.table-tr-td3.以下這幾種文件路徑分別用在什么地方，代表什么意思?? css/a.css相對路徑，表示當前目錄下css文件夾內的a.css文件。? ./css/a.css同上，“./”即代表當前目錄。? b.css相對路徑，表示當前目錄下的b.css文件。? ../imgs/a.png相對路徑，表示當前目錄的上級目錄下的imgs文件夾中的a.png文件。? /Users/hunger/project/css/a.css絕對路徑，表示本地a.css文件在硬盤上的絕對地址。? /static/css/a.css絕對路徑，表示a.css文件在服務器上的絕對地址。? /kejian1/8-1.png絕對路徑，表示8-1.png在網絡上的絕對地址。分別用div-dl-dt-dd塊狀結構、div-ul-li結構（黑點不用管）、使用<img/>和<br/>標簽實現(xiàn)如圖1.36所示的圖文混排效果。div-dl-dt-dd塊狀結構<!doctypehtml><head><metacharset=“utf-8”><title>作業(yè)圖文混排</title></head><body><div><dl><dt><imgsrc="file:///E|/DIV+CSS/打字/單元圖片/jiemian3.jpg"alt="相宜本草"title="相宜本草"/></dt><dd>滋潤型的潔面產品，適合中至干性，混合性肌膚，秋冬等干燥季節(jié)</dd><dt><imgsrc="file:///E|/DIV+CSS/打字/單元圖片/jiemian2.jpg"alt="玉蘭油"title="玉蘭油"/></dt><dd>有效抑制黑色素，自然條理，讓肌膚水嫩</dd><dd>超值價：8元開搶！</dd></dl></div></body></html>div-ul-li結構<!doctypehtml><head><metacharset=“utf-8”><title>作業(yè)圖文混排</title></head><body><div><ul><li><imgsrc="file:///E|/DIV+CSS/打字/單元圖片/jiemian3.jpg"alt="相宜本草"title="相宜本草"/></li><li>滋潤型的潔面產品，適合中至干性，混合性肌膚，秋冬等干燥季節(jié)</li><li><imgsrc="file:///E|/DIV+CSS/打字/單元圖片/jiemian2.jpg"alt="玉蘭油"title="玉蘭油"/></li><li>有效抑制黑色素，自然條理，讓肌膚水嫩</li><li>超值價：8元開搶！</li></ul></div></body></html>使用<img/>和<br/>標簽實現(xiàn)<!doctypehtml><head><metacharset=“utf-8”><title>作業(yè)圖文混排</title></head><body><p><imgsrc="file:///E|/DIV+CSS/打字/單元圖片/jiemian3.jpg"alt="相宜本草"title="相宜本草"/><br/>滋潤型的潔面產品，適合中至干性，混合性肌膚，秋冬等干燥季節(jié)<br/><imgsrc="file:///E|/DIV+CSS/打字/單元圖片/jiemian2.jpg"alt="玉蘭油"title="玉蘭油"/><br/>有效抑制黑色素，自然條理，讓肌膚水嫩<br/>超值價：8元開搶！<br/></p></body></html>項目三習題答案一、選擇題1、A 2、C 3、B 4、A 5、B 6、D 7、A 8、B 9、B二、填空題1、<inputtype=checkboxchecked>2、image3、select，option，select4、name method post action5、瀏覽器服務器6、Web頁 表單處理程序。項目四習題答案一、選擇題1、D 2、A 3、B 4、B 二、填空題1、<table></table><td></td>2、表格的一行表格的一列表格的標題3、rowspancolspan4、行列單元格三1、2、</html><head><metacharset=“utf-8”><title>caption\thead\tbody\tfoot等用法</title></head><body><tablewidth="500px"><caption>年終數(shù)據(jù)報表</caption><theadstyle="background:#0FF"><tr><th>季度</th><th>收入（RMB）</th></tr></thead><tbodystyle="background:#9CC"><tr><td>1季度</td><td>3000</td></tr><tr><td>2季度</td><td>2400</td></tr><tr><td>3季度</td><td>4900</td></tr><tr><td>4季度</td><td>4200</td></tr></tbody><tfootstyle="background:#FF0"><tr><td>平均收入</td><td>3825</td></tr><tr><td>總計</td><td>14500</td></tr></tfoot></table></body></html>項目五習題答案一、簡答題1. 簡單介紹HTML5中video視頻元素屬性。答案要點：video屬性主要autoplay、controls、height、width、loop、preload、src等。2. 簡單介紹HTML5中audio音頻元素屬性。答案要點：audio音屬性主要有src、autoplay、preload、controls項目六習題答案一、選擇題1、C 2、B3、C4、A5、C 6、A7、C8、B9、B二、簡答題1、什么是標記（標簽）選擇器、類別選擇器、ID選擇器，并舉例說明。CSS標記選擇器就是聲明哪些標記采用哪種CSS樣式。例如：h1{color:red;font-size:25px;}類別選擇器的名字可以由用戶自定義，用做html頁面某標簽的class屬性值。例如：.red{color:red;font-size:18px}ID選擇器是針對html頁面中某個具有此ID屬性的標簽設置的CSS樣式。例如：#bold{font-weight:bold;}2、舉例說明什么是行內式CSS樣式、什么是內嵌式CSS樣式、什么是鏈接式CSS樣式。行內式是直接對html的標記使用style屬性，然后將CSS代碼直接寫在其中。例如：<pstyle=”color:#ff0000;font-size:20px>正文內容</p>內嵌樣式表就是將CSS寫在<head>與</head>之間，并且用<style>和</style>標記進行聲明。例如：<head><styletype=”text/css”>p{color:#0000ff}</style></head>鏈接式CSS樣式表是通過使用html鏈接文件標簽link將外部CSS應用到本頁面的樣式使用方法。例如：<linkhref=”myCSS.css”type=”text/css”rel=”stylesheet”>3、舉例說明什么是導入式CSS樣式。采用import方式導入的樣式表，在html文件初始化時，會被導入到html文件內，作為文件的一部分，類似內嵌式的效果。例如：@importurl(sheet.css);4、什么是交集選擇器、什么是并集選擇器、什么是后代選擇器，并舉例說明。交集選擇器是由兩個選擇器直接連接構成，其結果是選中二者各自元素范圍的交集。其中第1個必須是標記選擇器，第2個必須是類別選擇器或者ID選擇器。例如：p.special{color:red}。并集選擇器或者稱為“集體聲明”，它的結果是同時選中各個基本選擇器所選擇的范圍。例如：h1,h2,p{color:purple;font-size:15px;}后代選擇器的寫法就是把外層的選擇器名字寫在前面，內層的選擇器名字寫在后面，之間用空格分隔。例如：pspan{;color:red;}5、CSS有幾種引入方式?link和@import有什么區(qū)別?（1）外部樣式<linkrel="stylesheet"type="text/css"href="css文件地址"media="all"/>，通過<link>標簽鏈接外部css文件，此標簽一般寫在<head>標簽中。可使用多個此語句添加多個樣式表，瀏覽器會合并顯示。<styletype="text/css">@importurl(css文件地址);</style>在<style>標簽中添加@import語句，鏈接外部css文件。此語句須寫在其他css語句之前，否則不起作用。（2）內部樣式<styletype="text/css">css語句</style>將css語句寫在<style>標簽內，此標簽一般放在<head>內。（3）行內樣式<pstyle="color:red;">將css語句作為style屬性的值，直接寫在需要添加樣式的HTML標簽內。此形式不推薦使用。link與@import的區(qū)別? <link>本質上是HTML標簽，@import本質上是css語句。? 除了鏈接css文件之外還有許多其他的功能，@import只能鏈接css文件。? 加載順序不同。當一個頁面被加載的時候，link引用的CSS會同時被加載，而@import引用的CSS會等到頁面全部被下載完再被加載。所以有時候瀏覽@import加載CSS的頁面時開始會沒有樣式，然后閃爍一下才顯示樣式，在網速慢的時候比較明顯。6、實現(xiàn)效果圖，注意多選擇器的組合應用以及語法。<!DOCTYPE><html><head><metacharset=utf-8" /><title>樣式疊加規(guī)則</title> <style>p,h1{color:red;}h3{color:green;}#myDiv{font-size:20px;background:#ff00ff;}#green{color:green;}</style></head><body><p><h2id="green">ID選擇器</h2> <h2>其他h2</h2><h2>其他h2</h2></p><p><divid="myDiv">myDiv</div> </p><p><h3>h3</h3> <h3>h3</h3><h3>h3</h3><h3>h3</h3></p><h1class="yellow">h1</h1><h1class="yellow">h1</h1></body></html>項目七習題答案一、選擇題1、BD 2、AC3、B4、C二、解釋以下CSS樣式的含義。a:link{ color:#3333cc;text-decoration:none}a:visited{ color:#990099;text-decoration:none}a:active{ color:#ff0000;text-decoration:underline}a:hover{ color:#3333cc;text-decoration:underline}設置超鏈接樣式：未操作時：顏色為#3333cc，無下劃線；單擊過后：顏色為#990099，無下劃線；單擊時：顏色為#ff0000，有下劃線；懸停時：顏色為#3333cc，有下劃線；項目八習題答案一、案例分析題1、解釋以下CSS樣式的含義。table{ border:1px#333solid; font:12pxarial; width:500px}td,th{ padding:5px; border:2pxsolid#EEE; border-bottom-color:#666; border-right-color:#666;}將表格邊框寬度設為1px，顏色設為#333，邊框為實線；表格中的字體大小設為12px,字體類型為arial；表格寬度為500px。設置單元格和表頭部分的樣式：內邊距為5px，邊框寬度2px，實線，顏色為#EEE，底部和右側邊框顏色特別設為#6662、解釋以下CSS樣式的含義。form{border:1pxdotted#AAAAAA;padding:3px6px3px6px;margin:0px;font:14pxArial;}select{width:80px;background-color:#ADD8E6;}設置表單邊框寬度為1px，點劃線，顏色為#AAAAAA，內上、右、下、左邊距分別為：3px6px3px6px，外邊距為0px，字體為14px大小的Arial字體。設置選擇框寬度為80px，背景顏色為#ADD8E63、解釋以下CSS樣式的含義。input{color:#00008B;}input.btn{background-color:#ADD8E6;padding:1px2px1px2px;}設置input標簽中字體顏色為#00008B；input標簽中id屬性為btn的按鈕背景顏色設為#ADD8E6，內上、右、下、左邊距分別設為1px、2px、1px、2px二、簡單題1、在CSS中一個獨立的盒子模型有哪幾部分組成？content（內容）、border（邊框）、padding（內邊距）和margin（外邊距）2、舉例說明什么是塊級元素和行內元素？塊級元素總是占據(jù)一個矩型區(qū)域，并且同級兄弟塊依次豎直排列，左右撐滿。例如：<ul>行內元素不占有獨立的區(qū)域，并且同級元素之間橫向排列，到最右端自動這行。例如：<a>3、解釋一下div標簽的作用<div>是一個區(qū)塊容器標記，即<div>與</div>之間相當于一個容器，可以容納段落、標題、表格、圖片等各種html元素。項目九習題答案一、簡答題1、解釋盒子模型的float屬性。float屬性默認為none，也就是標準流通常的情況。如果將float屬性的值設置為left或right，元素會向其父元素的左側或右側靠近，同時默認情況下，盒子的寬度不再伸展，而是收縮，根據(jù)盒子里面的內容的寬度來確定。2、解釋盒子模型的display屬性。display屬性用于確定盒子的類型。display屬性設為inline，即為“行內”；設為block，即為“塊級”；設為none，即為“無”，也就是隱藏盒子。二、按要求寫CSS樣式表1、寫出下列要求的CSS樣式表（1）設置頁面背景圖像為login_back.gif，并且背景圖像垂直平鋪。（2）使用類選擇器，設置按鈕的樣式，按鈕背景圖像：login_submit.gif；字體顏色：#FFFFFFF；字體大?。?4px；字體粗細：bold；按鈕的邊界、邊框和填充均為0px。body{background-image:url(img/login_back.gif);background-repeat:repeat-y;}.picButton{background-image:url(img/login_submit.gif);color:#FFFFFF;font-size:14px; font-weight:bold;margin:0px;border:0px;padding:0px;}2、寫出下列要求的CSS樣式表（1）使用<td>標簽樣式，設置字體顏色：#2A1FFF；字體大?。?4px。內容與邊框之間的距離：5px。（2）使用超鏈接偽類：不帶下劃線；顏色：#333333；鼠標懸停在超鏈接上方時，顯示下劃線；顏色：#FF5500。td{ color:#2A1FFF; font-size:14px; padding:5px;}A{ color:#333333; text-decoration:none; }A:hover { color:#FF5500; text-decoration:underline; }項目十習題答案一、簡答題1、簡述典型頁面的布局結構。答案要點：div-ul-li、div-dl-dt-dd、div-table-tr-td2、div-ul-li經常用于哪種頁面的布局結構？答案要點：div-ul（ol）-li常用于分類導航或菜單項目十一習題答案一、簡答題1、簡述利用Dreamweaver搭建站點的過程。答案要點：使用Dreamweaver創(chuàng)建站點，其實站點就是我們硬盤上的一個文件夾。選擇“站點→新建站點”命令，進行相應設置，然后單擊“保存”按鈕即可。2、簡述建立大型網站時建立目錄結構的注意事項。答案要點：（1）不要將所有文件都存放在根目錄下。（2）按欄目內容建立子目錄。（3）在每個主目錄下建立獨立的images目錄。（4）目錄的層次不要太深，建議不要超過3層。原因很簡單，維護管理方便。（4）不要使用中文目錄；網絡無國界，使用中文目錄可能對網址的正確顯示造成困難；不要使用過長的目錄；盡管服務器支持長文件名，但是太長的目錄名不便于記憶；盡量使用意義明確的目錄。比如中小型網站，一般會創(chuàng)建如下的結構，可將圖片放到images文件夾，css文件歸放到css目錄，js存放javaScript目錄等。項目十二習題答案一、簡答題答案略項目十三習題答案一、簡答題答案要點：<body><divclass="content_list"><dl> <dt><imgsrc="images/promote-1.jpg"alt="alt"/></dt> <dd><ahref="commoditys_detailInfo.htm">惠普商務移動應用英寸筆記本</a></dd></dl><dl> <dt><imgsrc="images/promote-2.jpg"alt="alt"/></dt> <dd><ahref="commoditys_detailInfo.htm">夏新N6GPS真人語音導航手機超低特價瘋搶 數(shù)量有限！</a></dd></dl><dl> <dt><imgsrc="images/promote-3.jpg"alt="alt"/></dt> <dd><ahref="commoditys_detailInfo.htm">三星家庭影院HT-TZ325 購機送好禮(超值性價比)</a></dd></dl><dl> <dt><imgsrc="images/laser-pen.jpg"alt="alt"/></dt> <dd><ahref="commoditys_detailInfo.htm">明基MP512投影機2899元送100元京卷SVGA 2200流明</a></dd></dl><dl> <dt><imgsrc="images/mouse.jpg"alt="alt"/></dt> <dd><ahref="commoditys_detailInfo.htm">羅技數(shù)據(jù)1TB移動鼠標729元開搶了！</a></dd></dl><dl> <dt><imgsrc="images/earphone.jpg"alt="alt"/></dt> <dd><ahref="commoditys_detailInfo.htm">海森那爾極品耳機絕對不容錯過！</a></dd></dl><dl> <dt><

溫馨提示

  • 1. 本站所有資源如無特殊說明，都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等，如果需要附件，請聯(lián)系上傳者。文件的所有權益歸上傳用戶所有。
  • 3. 本站RAR壓縮包中若帶圖紙，網頁內容里面會有圖紙預覽，若沒有圖紙預覽就沒有圖紙。
  • 4. 未經權益所有人同意不得將文件中的內容挪作商業(yè)或盈利用途。
  • 5. 人人文庫網僅提供信息存儲空間，僅對用戶上傳內容的表現(xiàn)方式做保護處理，對用戶上傳分享的文檔內容本身不做任何修改或編輯，并不能對任何下載內容負責。
  • 6. 下載文件中如有侵權或不適當內容，請與我們聯(lián)系，我們立即糾正。
  • 7. 本站不保證下載資源的準確性、安全性和完整性, 同時也不承擔用戶因使用這些下載資源對自己和他人造成任何形式的傷害或損失。

評論

0/150

提交評論