Web前端開發(fā)必知必會 選擇題答案及解析

《Web前端必知必會》選擇題答案及解析目錄第1課 Web前端簡介 1第2課 常用HTML標簽及其屬性 1第3課 超鏈接與路徑 2第4課 簡單CSS 2第5課 復合選擇器與網(wǎng)頁導航 3第6課 基本HTML5框架與應用 3第7課 盒子模型與DOM 3第8課 position位置屬性 4第9課 CSS+DIV固定寬度頁面布局 4第10課 表單基礎(chǔ) 4第11課 JavaScript基本應用 5第12課 jQuery特效 5第13課 固定寬度網(wǎng)頁實例 5第14課 響應式設計基礎(chǔ) 5第15課 響應式設計特點及應用 6第16課 Flexbox伸縮盒 6第17課 網(wǎng)站建設概述 6第18課 HTML5的API 6附錄補充：常用學習網(wǎng)站指南 7第1課 Web前端簡介1、答案：B解析：網(wǎng)頁三要素分別是結(jié)構(gòu)、表現(xiàn)、行為，對應的是HTM、CSS與JavaScript，C語言是另外的高級語言，通常用于底層的軟件開發(fā)，不是網(wǎng)頁需要的計算機語言。2、答案：C解析：網(wǎng)頁中通過JavaScript代碼，讓頁面具有交互性與動態(tài)性。3、答案：A

解析：所有要顯示在網(wǎng)頁中的內(nèi)容，都應該放在body標簽中。4、答案：C解析：網(wǎng)站中除了使用HTML、CSS外，也會使用JavaScript代碼實現(xiàn)頁面互動。 第2課 常用HTML標簽及其屬性 1、答案：C解析：color不是網(wǎng)頁元素的標簽名。2、答案：C解析：<br>是一個換行符，只需要一個<>，不成對。3、答案：B解析：文本的上標用的是標簽，下標用標簽，不屬于特殊符號。4、答案：D解析：想要設置雙線的表格，cellspacing單元格間距不為0，且要設置border不為0。 5、答案：C解析：<ol>結(jié)合<li>生成帶數(shù)字的項目列表。6、答案：D解析：讓一個div整體居中的方式，一是有一定寬度（其寬度不能是100%），二是外邊距margin為自動auto，D選項中margin:auto0px;表示上下外邊距為自動，左右為0，因此無法實現(xiàn)居中。第3課 超鏈接與路徑1、答案：B解析：<ahref="#">，表示空鏈接，且href屬性是不能缺省的。2、答案：C解析：四個選項中，只有<rect>表示的是地圖中的矩形區(qū)域，用戶也能用<circle>、<poly>等圈定超鏈接區(qū)域，其它3項在使用地圖超鏈接時都會用到，不可缺少。第4課 簡單CSS1、答案：D解析：“#12x”的ID名為數(shù)字開頭，錯了；“myfont”非標簽，前面缺少用“#”或類“.”開頭；“img”是標簽名，不能作為類名，前面不能帶符號；只有D選項是正確，body為標簽名。2、答案：A解析：CascadingStyleSheets即層疊式樣表。3、答案：C解析：color為字體顏色、font-size為字體大小、font-weight為字體粗細，float通常用于左右并排，不屬于文本樣式。4、答案：D解析：應該是color:RED;，RED為預定義的顏色，其他預定義顏色包括：BLUE,YELLOW,WHITE,BLACK,PURPLE,CYAN等等。5、答案：B解析：默認填充方式為全部充滿，即repeat（X、Y方向全部填充）。6、答案：B解析：p.first{…}所定義的樣式，此first類只對段落有效，對首字下沉需要用的<span>標簽無效。7、答案：B解析：只有選項B是合法的樣式寫法。8、答案：B解析：A組“#123”不規(guī)范，C組“.a”和“.b”不規(guī)范，D組“.h3”不規(guī)范，只有B組的選擇器命名全部規(guī)范。9、答案：C解析：通常邊框線需要設置三個屬性：顏色、線型、粗細，C組中只設置了顏色，因此選C。10、答案：A解析：A選項是外邊距屬性，其余三個選項均為內(nèi)邊距設置，且三者的含義是一樣的。11、答案：C解析：類、ID選擇器需要顯式引用，而標簽，以及很多的復合選擇器，例如：navulli，li:nth-child(even)等，是不需要顯式引用的。12、答案：B解析：選項B中，代碼的最終結(jié)果頁面顯示為灰色，因為網(wǎng)頁的樣式時從上至下執(zhí)行的，而且行內(nèi)式樣式的優(yōu)先級最高，先設置為粉色，但是又在行內(nèi)設置為灰色，因此最終為灰色。第5課 復合選擇器與網(wǎng)頁導航 1、答案：C解析：a:hover為鼠標懸停。2、答案：D解析：選項從A~D的屬性含義分別為：文本對齊方式、文本大小寫轉(zhuǎn)換、文本縮進、文本修飾，其中下劃線（underline）為文本修飾屬性。3、答案：D解析：D選項中，用“,”分隔的是成組選擇器，nava:link與a:visited二者共用代碼，因此后面的nav不可省，即要改為“nava:link,nava:visited”才是超鏈接中后代選擇器的正確寫法。4、答案：D解析：navilia:hover選擇器寫法錯誤，“navi”需要添加ID符號“#”。第6課 基本HTML5框架與應用 1、答案：A解析：只有A選項的說法是正確的。meta中的信息不會顯示在網(wǎng)頁中，不會顯示在網(wǎng)頁標題中，也不屬于CSS樣式。2、答案：D解析：制作HTML5網(wǎng)頁的時候，還是以開發(fā)者習慣為主，建議使用結(jié)構(gòu)化語義化標簽<header>、<footer>，但非必須。3、答案：C解析：選項A錯在<navi>，并無此標簽；選項B與選項D均未使用<nav>標簽；只有選項C是正確的。4、答案：D解析：<foot>不對，無此標簽名。5、答案：A解析：有效頁面居中需要同時滿足兩個條件，只有選項A符合。1）有一定寬度，不能是100%寬度；2）外邊距margin左右自動。第7課 盒子模型與DOM 1、答案：D解析：dashed表示虛線，需要有padding值才能有背景色，float實現(xiàn)圖文混排，只有選項D的結(jié)果全部符合要求。2、答案：D解析：只有D說法正確。兩個div之間為父子關(guān)系或稱嵌套關(guān)系，盒子模型中不存在“上下關(guān)系”的說法。3、答案：A解析：float:none;能夠讓元素回到標準流狀態(tài)。4、答案：D解析：float屬性用處很多，ABC選項都是它的主要功能。第8課 position位置屬性 1、答案：B解析：只有選項B是正確的。父塊的position屬性不能是none，而子塊需要設置為position:absolute;。2、答案：D解析：除了使用top、left屬性，也可以使用bottom、right屬性。3、答案：A解析：apDiv（層）的本質(zhì)還是使用ID的div標簽，它本身不是一個單獨的標簽。第9課 CSS+DIV固定寬度頁面布局 1、答案：B解析：一般選擇器命名應該見詞生義，#top-nav適合應用于導航，而不是最外容器。2、答案：C解析：div是塊級元素，默認占用一行，因此僅僅設置較小的寬度，是無法實現(xiàn)并排的。。3、答案：B解析：無選項B說法。。4、答案：B 解析：背景圖像填充是可以選擇背景圖像顯示位置的；通常使用無序列表（ul、li）設計橫向?qū)Ш讲藛?；三列布局也是采用float+clear屬性進行布局，只有選項B的說法是正確的。5、答案：A解析：是保證第三個兄弟塊在前兩個兄弟塊下方的一種方法，也可以通過設置包含左右布局塊的父塊的overflow:hidden;，保證第三方塊無法入侵。?第10課 表單基礎(chǔ) 1、答案：A解析：略。2、答案：D解析：當一組若干個單選框的所有name相同時，每次只能選中一個。3、答案：B解析：多行文本域的標簽為<textarea>。4、答案：D解析：普通文本框type為"text"。5、答案：A解析：placeholder屬性用于提醒用戶輸入哪種信息。6、答案：D解析：同上第2小題第11課 JavaScript基本應用 1、答案：D解析：JavaScript代碼均添加在網(wǎng)頁代碼中的<script>與</script>之間。2、答案：B解析：文檔對象模型。3、答案：C解析：既可以將代碼嵌入到網(wǎng)頁文件，也可以使用鏈接外部JS文件。4、答案：A解析：A選項的getElementByIdName()中多了Name，錯了。5、答案：C解析：Math.round(x)中x的值只能是數(shù)值。6、答案：C解析：getYear()方法只能返回年份的后2位，getFullYear()是返回四位年份。第12課 jQuery特效 1、答案：A解析：$是jQuery程序標志性的符號。2、答案：D解析：不一定要在線鏈接，也可以將庫文件下載到本地后使用。3、答案：A解析：jQuery的口號是“寫得更少，做得更多”。4、答案：C解析：ID是網(wǎng)頁唯一標識，因此利用ID選擇器來獲取網(wǎng)頁中的元素最快最高效。第13課 固定寬度網(wǎng)頁實例 1、答案：D解析：開發(fā)網(wǎng)站的時候，建議使用<header>、<footer>等語義化新標簽，但不是一定要。2、答案：C解析：動態(tài)網(wǎng)站指的是網(wǎng)頁內(nèi)容是通過jsp、asp等技術(shù)結(jié)合數(shù)據(jù)庫等進行動態(tài)更新，如果只有JavaScript特效的網(wǎng)頁，并不是動態(tài)網(wǎng)站。3、答案：D解析：按鈕效果的超鏈接不是表單元素按鈕，其本質(zhì)上還是超鏈接。第14課 響應式設計基礎(chǔ) 1、答案：D解析：開發(fā)網(wǎng)站的時候，建議使用<header>、<footer>等語義化新標簽，但不是一定要。2、答案：C解析：動態(tài)網(wǎng)站指的是網(wǎng)頁內(nèi)容是通過jsp、asp等技術(shù)結(jié)合數(shù)據(jù)庫等進行動態(tài)更新，如果只有JavaScript特效的網(wǎng)頁，并不是動態(tài)網(wǎng)站。3、答案：D解析：按鈕效果的超鏈接不是表單元素按鈕，其本質(zhì)上還是超鏈接。第15課 響應式設計特點及應用 1、答案：D解析：選項D中，screen后面缺少and，因此錯誤。。2、答案：C解析：響應式設計中單張網(wǎng)頁的代碼會更多更累贅，工作量更大。3、答案：A解析：以上四個選項中，只有SVG屬于矢量圖形，放多大都不失真。4、答案：C解析：響應式網(wǎng)站建議使用HTML5標準但不是必須HTML5。5、答案：D解析：選項A中，使用background-position:…px…px，可以設置背景的精確到px位置；選項B中，GIF圖像格式是8位的圖像；選項C中，設置圖片的{width:50%;}，顯示的圖像大小就是其父塊的一半。只有選項D是正確的。第16課 Flexbox伸縮盒 1、答案：A解析：選項B錯，還需要設置父塊的display:flex;屬性；選項C錯，應該在子項中添加order屬性；選項D錯，也還需要設置父塊的display:flex;屬性；只有選項A說法是正確的。2、答案：B解析：設置為比例寬度也能自動縮放子項目元素大小，因此不是flexbox重要的功能。第17課 網(wǎng)站建設概述 1、答案：D解析：一般地，網(wǎng)站的更新與維護不算在開發(fā)過程內(nèi)，而是作為一種售后服務。2、答案：D解析：網(wǎng)站中的JavaScript代碼，可以根據(jù)實際需要直接嵌入到HTML文檔內(nèi)，并不一定需要將都放入外部js文件中，而css樣式一般使用外部CSS文件。第18課 HTML5的API 1、答案：B解析：<video>是HTML5視頻標簽，本身不需要JavaScript代碼連接接口。2、答案：A解析：選項A只是對<canvas>畫布設置其CSS樣式背景，并不是API的一部分。附錄補充：常用學習網(wǎng)站指南常見的學習網(wǎng)站與工具網(wǎng)站見下面附表。附表常用學習網(wǎng)站序號網(wǎng)站名稱網(wǎng)址備注一、學習網(wǎng)站1W3C學校/tags/index.asp入門級2菜鳥教程/入門級3Bootstrap響應式框架/4FontAwesome字體