網(wǎng)頁設計與開發(fā)第4章試卷及答案

《網(wǎng)頁設計與開發(fā)第4章》試卷一、選擇題1.無序列表的HTML代碼是（）A．〈li>〈ui〉。..〈/li>B．〈ul>〈li>。..〈/ul〉C．〈Ol>〈li>。。.〈Ol>D．〈li>〈ol>.。。〈/li〉答案：B2.有序列表的HTML代碼是（c)A．〈ul〉<li〉。。。</ul>B．<li〉<ul〉..。</li〉C．〈ol>〈li〉..?！?ol>D．<li〉<ol〉.。.<li〉3。定義列表的HTML代碼是()A．〈dt〉<dl〉…〈dd〉…〈/dl>B．〈dd〉<dt>…<dl〉…〈/dd〉C．<dt〉<dd〉…<dl>…</dt〉D．〈dl>〈dt〉…<dd>…</dl>答案： D4.下列說法錯誤的是（)A．disc是定制表中type的標記B．left是定制表中type的標記C．circle是定制表中type的標記D．square是定制表中type的標記答案：B5。定制表中type標記中的circle表示（）感謝閱讀A．圓點B．圓環(huán)C．字母D．方塊答案：A6。定制表中type標記中的square表示（）感謝閱讀A．圓點B．圓環(huán)C．字母D．方塊答案: D7。定制有序列表表中的序號的起始值的表示法為（）A．〈olbegint=#>B．〈olstar=?！礐．<olstill=＃〉D．<olstart=#>答案： D8.以下有關列表的說法中，錯誤的是（）A．有序列表和無序列表可以互相嵌套。B．指定嵌套列表時,也可以具體指定項目符號或編號樣式。感謝閱讀C．無序列表應使用UL和LI標記符進行創(chuàng)建。感謝閱讀D．在創(chuàng)建列表時，LI標記符的結束標記符不可省略.感謝閱讀答案: D9.在HTML網(wǎng)頁中,用來定義有序列表的元素包括（）謝謝閱讀A．olB．ulC．liD．dl答案: A10.有序列表的項目編號要從小寫字母a開始，type屬性值設置為(）謝謝閱讀A．a(chǎn)B．1C．AD．I答案: A11。有序列表的項目編號要從大寫羅馬數(shù)字開始，type屬性值設置為(）謝謝閱讀A．a(chǎn)B．1C．AD．I答案: A12.在CSS中，對<ul>標記進行樣式定義，下面寫法正確的是哪個(）感謝閱讀A．list-style—type:discB．type=discC．list—style:discD．style-list-type：disc答案: A13.如果列表項前面的符號要換用特定的圖片顯示，使用CSS如何設置（）精品文檔放心下載A．ul{list-style-type：images/a。gif}謝謝閱讀B．ul｛list—style-image：images/a.gif}感謝閱讀C。ul{list-style—type:url（images/a.gif）}精品文檔放心下載D．ul{list-style—image：url(images/a.gif)}精品文檔放心下載答案：D14。定義一個列表樣式為項目符號采用默認圓點、列表行高33px、字體大小22px，如何表達（)謝謝閱讀A．ul{list—style-type：disc；line—height：33px;font-size:22px}感謝閱讀B．ul｛list-style-type：disc；height：33px；font—size：22px｝謝謝閱讀C．ul{list-style-type:disc；height：33px；size:22px}感謝閱讀D．ul{list-style：disc；height：33px;size：22px}謝謝閱讀答案：A15.使用CSS樣式清除列表項前的圓點，使用的語法是（）精品文檔放心下載A．list—style：noneB．list-style：nodiscC．list—style：nonediscD．list-style：0答案：A16。對li標記添加什么樣式定義實現(xiàn)了將一個垂直排列的導航改為水平導航。謝謝閱讀A．float：leftB．list-style：leftC．margin-left:10pxD．text-align：left答案:A17。如何產(chǎn)生帶有數(shù)字列表符號的列表？A．〈ul>B．<dl〉C．<ol>D．〈list>答案: C18.如何產(chǎn)生帶有圓點列表符號的列表?A．<dl〉B．<list>C．<ol〉D．〈ul>答案: B19.如何產(chǎn)生帶有正方形的項目的列表？A。list—type：squareB.list—style—type:squareC.type:squareD。type:2答案：B20.我們想要將頁面中的文本采用項目符號的形式予以顯示，采用哪些標記組合可以達到我們的要求？感謝閱讀A。<P〉和〈hr〉B.〈UL>和〈li〉C。〈BR>和〈p>D.〈LI>和〈A>答案：B21.要在網(wǎng)頁中顯示下面的列表.蘋果.芒果。橘子下列語句正確的是（）A。<ul〉<li>蘋果<li>芒果〈li〉橘子</ul〉謝謝閱讀B.<ol〉〈li>蘋果<li>芒果〈li>橘子</ol〉精品文檔放心下載C.〈ul>〈ui〉蘋果<ui〉芒果〈ui>橘子〈/ul>精品文檔放心下載D.〈oltype=A〉〈li〉〈li>蘋果<li〉芒果<li>橘子〈/ol>謝謝閱讀答案:A22。下列HTML標記中，屬于成對標記的是（）。感謝閱讀A．<br><ul><P〉D?！磆r>答案:B23。有序列表的項目編號要從大寫英文字母開始，type屬性值設置為（)感謝閱讀A．a(chǎn)B．1C．AD．I答案： C24.有序列表的項目編號要從小寫羅馬數(shù)字開始，type屬性值設置為（）感謝閱讀A．a(chǎn)B．1C．AD．i答案: d25。改變有序列表的項目編號起始值的屬性是(）A．valueB．startC．typeD．begin答案: B26.li標記里的type屬性設置的影響范圍是（)謝謝閱讀A．只影響當前列表項B．影響了后續(xù)列表項C．影響了全部列表項D．不能影響任何列表項答案: A27.對li標記里的type屬性設置的指定，能使用在（）謝謝閱讀A．無序列表中B．有序列表中C．無序列表和有序列表中D．不能進行l(wèi)i標記的type屬性設置答案： C28.改變有序列表的單個項目編號值的大小的屬性是（)謝謝閱讀A．valueB．startC．typeD．begin答案：A29.改變有序列表的單個項目編號值的value屬性能應用與（）感謝閱讀A．無序列表中B．有序列表中C．無序列表和有序列表中D．不能應用與有序列表和有序列表中答案:B30.下列說法不正確的是（)A．嵌套列表可以是無序列表的嵌套B．嵌套列表可以是有序列表的嵌套C．嵌套列表可以是無序列表和有序列表的混合嵌套D．列表不能進行嵌套答案:D二、填空題1）無序列表中可用的項目符號包括______________、______________和______________。謝謝閱讀答案：disc circle square2）用于取消列表項前默認項目符號的樣式定義是_________________________________.感謝閱讀答案: list-style：none3）使得列表項從默認的垂直排列到水平排列的樣式定義是_____________________。感謝閱讀答案： float：left4)有序列表標記〈ol>的type屬性可以指定出現(xiàn)在列表項前的項目編號的樣式,其取值可以是:、、、和五種。感謝閱讀答案:1aAiI5）使用有序列表標記的屬性后，用戶則可改變編號的起始值。該屬性值是一個，表示從哪一個數(shù)字或字母開始編號。感謝閱讀答案： start整數(shù)6）商業(yè)網(wǎng)站開發(fā)中的新聞信息常常采用來開發(fā)。答案： 無序列表7。設置CSS屬性float的值為_______時可取消元素的浮動。感謝閱讀答案:none8.為一個列表項設置邊框4px，實心邊框，列表項字體顏色為#ff9900,列表項背景顏色為#fc3,可通過利用CSS設置〈li>的_______即可。感謝閱讀答案:li{border：4pxsolid#ff9900；background：＃fc3｝感謝閱讀9。定制表中type標記中的circle表示_______.精品文檔放心下載答案： 空心圓點。定制有序列表中序號啟始值表示法為_______。答案：<olstart=#〉三、簡答題寫出ul、ol、dl三種列表的html結構。謝謝閱讀答案：Ul列表的結構如下<ul>〈li〉 〈/li〉</ul>OL列表的結構如下〈ol><li> </li>〈/ol>DL列表的結構如下<dl><dt〉 </dt〉<dd〉 </dd〉</dl〉2。簡述有序列表標記的type屬性.答案：使用有序列表標記的type屬性，用戶可以指定出現(xiàn)在列表項前的項目編號的樣式,其取值以及相對應的編號樣式如下：精品文檔放心下載“1”：指定項目編號為阿拉伯數(shù)字(IE瀏覽器的默認值是disc);精品文檔放心下載“a”：指定項目編號為小寫英文字母；“A"：指定項目編號為大寫英文字母；“i"：指定項目編號為小寫羅馬數(shù)字;“I”:指定項目編號為大寫羅馬數(shù)字。知識點：有序列表3。舉例說明如何改變有序列表標記的type屬性的編號起始值。精品文檔放心下載答案:通常，在指定列表的編號樣式后，瀏覽器會從“1”、“a"、“A"、“i”或“I”開始自動編號.而在使用有序列表標記的start屬性后，用戶則可改變編號的起始值。start屬性值是一個整數(shù),表示從哪一個數(shù)字或字母開始編號。例如，設置start=”3”,則有序列表的列表項編號將從“3”、“c”、“C”、“ⅲ"或“Ⅲ”開始編號.精品文檔放心下載4.列表是否能嵌套使用？有什么作用.答案：列表還可以嵌套使用，也就是一個列表中還可以包含有多層子列表.在網(wǎng)頁文件中,對于內容層次較多的情況，使用嵌套列表不僅使網(wǎng)頁的內容布局更加合理美觀，而且使其內容看起來更加清晰、明了。嵌套的列表可以是無序列表的嵌套，也可以是有序列表的嵌套，還可以是無序列表和有序列表的混合嵌套。謝謝閱讀知識點:嵌套列表四、實驗題制作一個用列表顯示的新聞顯示板塊，要求利用列表方法，適當運用字體、字號間距等的修飾完成新聞列表的定義。感謝閱讀答案:源代碼：〈!DOCTYPEhtmlPUBLIC"—//W3C//DTDXHTML1。0Transitional//EN"感謝閱讀"/TR/xhtml1/DTD/xhtml1—transitional。dtd”〉感謝閱讀<html>〈head><styletype="text/css”>。container{width：350px；margin:0auto;text-align:left；感謝閱讀background—color:＃EFEFDA;padding:20px;｝感謝閱讀。first_line{font—family:黑體;font-size：22px；padding—left：20px;｝謝謝閱讀ul｛list—style-type：disc;font-size：22px;line-height：33px;}謝謝閱讀〈/style〉〈/head〉<body〉〈divclass="container"><pclass="first_line"〉暴雪：商業(yè)藝術與技術的平衡之道〈/p〉謝謝閱讀<ul〉〈li〉點選名將搶禮包《千軍破》首服開啟〈/li〉〈li>戰(zhàn)國新游《王者天下》開啟搶禮包</li〉〈li>快來玩《德州撲克》與人斗其樂無窮</li>〈li>《十年一劍》真武俠一區(qū)開啟搶禮包</li〉<li〉可買賣游戲代碼傳魔獸大災變過審批〈/li><li〉兒時游戲50年變遷00后迷動畫愛網(wǎng)游〈/li>精品文檔放心下載〈li>監(jiān)獄強迫犯人打網(wǎng)游徐州禁少年進網(wǎng)吧</li>精品文檔放心下載〈li〉ipad成為最賺錢的移動游戲平臺〈/li〉感謝閱讀〈/ul〉</div〉</body〉</html〉。導航是一個網(wǎng)站的重要組成元素。利用列表顯示導航內容,并適當運用CSS3的字體、字號間距及浮動等修飾屬性能夠完成垂直導航條及水平導航條的制作。謝謝閱讀答案：源代碼文件〈htmlxmlns="http：///1999/xhtml”〉精品文檔放心下載〈head〉〈metahttp—equiv=”Content-Type"content=”text/html；charset=gb2312”/>謝謝閱讀<styletype=”text/css”〉body｛font—family：Verdana;font-size：12px；font—weight：bold;line-height：1。5px;｝謝謝閱讀｛color:#FFF；text-decoration：none；}a:hover{color：#F00;}感謝閱讀＃menu{border：1pxsolid＃CCC；height:26px；background：＃0000ff;}精品文檔放心下載#menuul{list-style:none;margin：0px；｝感謝閱讀#menuulli{float:left;padding:0px40px; line-height：26px;｝謝謝閱讀〈/style>〈/head〉〈body〉〈divid=”menu"><ul〉〈li〉〈ahref=""〉公司簡介</a〉</li〉精品文檔放心下載〈li>〈ahref=""〉產(chǎn)品中心</a〉</li〉感謝閱讀〈li><ahref=”"〉服務中心〈/a></li〉謝謝閱讀〈li>〈ahref=""〉在線訂單</a>〈/li〉精品文檔放心下載<li><ahref="”〉關于我們</a>〈/li〉謝謝閱讀</ul>〈/div〉〈/body>〈/html〉知識點：列表的綜合運用參考頁：P48學習目標：5.掌握使用列表制作導航條的方法難度:3提示一：該題考察知識點：4.5列表的綜合運用提示二：采用無序列表實現(xiàn)，主要的操作有去除項目樣式符號、調整行間距等。先制作垂直導航，然后使用浮動將垂直導航變化為水平導航。謝謝閱讀提示三：步驟1:創(chuàng)建文件水平導航。html，定義頁面結構，完成內容的基本布局謝謝閱讀<！DOCTYPEhtmlPUBLIC"—//W3C//DTDXHTML1.0Transitional//EN"感謝閱讀”/TR/xhtml1/DTD/xhtml1-transitional。dtd”〉精品文檔放心下載<html〉〈head>〈styletype="text/css"〉。container｛width:650px;margin:0auto；text-align:center；謝謝閱讀background—color:#FFFFFF；padding:20px；}精品文檔放心下載</style>〈/head>〈body>〈divclass="container”><!——在此內部添加內容——></div〉〈/body></html>步驟2：建立內容項的無序列表顯示下面的代碼在步驟一的基礎上，在DIV塊內加入了列表定義。精品文檔放心下載<divclass="container”〉〈ul><li〉公司簡介</li>〈li>產(chǎn)品中心</li〉<li>服務中心〈/li〉〈/ul></div〉此時已經(jīng)能夠看出導航的原型了，但是還相對簡陋,需要進行美化。可以從以下幾個方面考慮調整它的顯示樣式：謝謝閱讀第一:無序列表前的默認圓點需清除；第二：各列表項之間的間隔需加大；第三：效果圖中的背景色。步驟3：進行格式美化清除列表項前的圓點，可以通過設置〈li〉的“l(fā)ist-style:none”即可；精品文檔放心下載內容項之間的間隔可以通過增大〈li>的行間距，如“l(fā)ine-height:33px；”感謝閱讀導航項采用深藍色背景色根據(jù)上面的樣式分析，下面的頁面代碼在樣式定義部分定義了不同的樣式,并在正文中的對應部分添加了引用.精品文檔放心下載<！DOCTYPEhtmlPUBLIC”-//W3C//DTDXHTML1.0Transitional//EN"精品文檔放心下載"http：///TR/xhtml1/DTD/xhtml1-transitional。dtd”〉謝謝閱讀<html>〈head><styletype=”text/css”〉.container｛width：200px；margin：0auto；text—align：center;謝謝閱讀background-color:＃FFFFFF；padding：20px;｝謝謝閱讀#nav｛list-style:none;font-size：22px；line—height：40px；}感謝閱讀＃navli｛margin-top:5px;border—top：4pxsolid#7BC110；background：謝謝閱讀＃be6；｝</style></head><body