完整word版CSS樣式習題答案

1、、選擇題1.A.B.C.D.CSS是(C )的縮寫。Colorful Style Sheets Comp uter Style Sheets Cascadi ngStyle Sheets Creative Style Sheets2.A.B.C.引用外部樣式表的格式是( B )。mystyle.css3.A. HTML文檔的開始的位置B. HTML文檔的結束的位置C. 在head元素中D.引用外部樣式表的元素應該放在在body元素中4.A.B.C.內(nèi)部樣式表的元素是（ A）。5.A.B.C.D.元素中定義樣式表的屬性名是（styleclass styles fontA )。6.A.B.C.D.

2、下列( C )是定義樣式表的正確格式。body:color=black(body body:color=black body color: black body;color:black7.A. /*注釋語句B. /注釋語句C. /注釋語句D. 注釋語句下列（A ）是定義樣式表中的注釋語句。*/68ABCD如果要在不同的網(wǎng)頁中應用相同的樣式表定義，應該（ 直接在 HTML 的元素中定義樣式表在HTML的vheadB記中定義樣式表 通過一個外部樣式表文件定義樣式表 以上都可以C ）。9ABCD樣式表定義 #title color:red 表示（ B ）。 網(wǎng)頁中的標題是紅色的網(wǎng)頁中某一個 id 為

3、 title 的元素中的內(nèi)容是紅色的 網(wǎng)頁中元素名為 title 的內(nèi)容是紅色的 以上任意一個都可以10 A B CD樣式表定義 .outer background-color:yellow 表示（ 網(wǎng)頁中某一個 id 為 outer 的元素的背景色是紅色的 網(wǎng)頁中含有class=”outer”元素的背景色是紅色的 網(wǎng)頁中元素名為outer元素的背景色是紅色的 以上任意一個都可以B ）。47.光標移動文本框上方時，文本框邊框的顏色就改變，這是因為激發(fā)了下列的 （ C ）事件。A. onFocusB. onMouseUpC. onMousrOverD. onMousMOve48.下列屬性哪一個能

4、夠?qū)崿F(xiàn)層的隱藏？（A. display:falseB. display:hiddenC. display:noneD. display: 49.下列選項中，不屬于文本屬性的是（A. font-size）。B. font-styleC. text-alignD. font-color50.頁面上有一個按鈕btn，同時定義好了一個類樣式（按鈕圖片樣式表btnPic），那么使用（ B ）就可以實現(xiàn)背景圖片的改變。A. onMouseOver=className=btnPicB. onMouseOver=this.className=btnPicC. onMouseOver=this.style.cl

5、assName=btnPicD. this.btn.style.className=btnPic二、簡答題1、什么是標記選擇器并舉例說明。CSS標記選擇器就是聲明哪些標記采用哪種CSS樣式。例如： h1 color:red;font-size:25px; 2、什么是類別選擇器并舉例說明。類別選擇器的名字可以由用戶自定義，用做html頁面某標簽的class屬性值。例如： .redcolor:red; font-size:18px 3、什么是 ID 選擇器并舉例說明。ID選擇器是針對html頁面中某個具有此ID屬性的標簽設置的CSS樣式。例如： #bold font-weight:bold; 4、

6、舉例說明什么是行內(nèi)式 CSS 樣式。行內(nèi)式是直接對html的標記使用style屬性，然后將CSS代碼直接寫在其中。 例如： 正文內(nèi)容 5、舉例說明什么是內(nèi)嵌式 CSS樣式。內(nèi)嵌樣式表就是將 CSS寫在與間，并且用和v/style標 記進行聲明。例如： p color:#0000ff 6、舉例說明什么是鏈接式 CSS 樣式。鏈接式CSS樣式表是通過使用html鏈接文件標簽link將外部CSS應用到本頁面 的樣式使用方法。例如： 7、舉例說明什么是導入式CSS樣式。采用 import 方式導入的樣式表，在 html 文件初始化時，會被導入到 html 文件內(nèi)， 作為文件的一部分，類似內(nèi)嵌式的效果。

7、例如： import url（sheet.css）;8、什么是交集選擇器，并舉例說明。 交集選擇器是由兩個選擇器直接連接構成， 其結果是選中二者各自元素范圍的交 集。其中第 1個必須是標記選擇器，第 2個必須是類別選擇器或者 ID 選擇器。例如： p.special color:red 9、什么是并集選擇器，并舉例說明。并集選擇器或者稱為“集體聲明” ，它的結果是同時選中各個基本選擇器所選擇 的范圍。color:purple; font-size:15px例如： h1,h2,p 10、什么是后代選擇器，并舉例說明。內(nèi)層的選擇器名字寫在后和margin （外邊距）后代選擇器的寫法就是把外層的選擇

8、器名字寫在前面， 面，之間用空格分隔。例如： p span color:red11、在 CSS 中一個獨立的盒子模型有哪幾部分組成？ content （內(nèi)容）、border （邊框）、padding （內(nèi)邊距）12、舉例說明什么是塊級元素和行內(nèi)元素？塊級元素總是占據(jù)一個矩型區(qū)域， 并且同級兄弟塊依次豎直排列， 左右撐滿。 例 如： 行內(nèi)元素不占有獨立的區(qū)域，并且同級元素之間橫向排列，到最右端自動這行。 例如： 13、解釋一下 div 標簽的作用div是一個區(qū)塊容器標記，即div與v/div之間相當于一個容器，可以容納段 落、標題、表格、圖片等各種 html 元素。14、解釋一下span標簽的作

9、用span標記和div 一樣，作為容器可以容納各種 素，在它的前后不會換行。html 元素，但它是一個行內(nèi)元15、解釋盒子模型的 float 屬性。float屬性默認為none,也就是標準流通常的情況。 left或right，元素會向其父元素的左側或右側靠近， 度不再伸展，而是收縮，根據(jù)盒子里面的內(nèi)容的寬度來確定。如果將 float 屬性的值設置為 同時默認情況下，盒子的寬16、解釋盒子模型的 display 屬性。display 屬性用于確定盒子的類型。 display 屬性設為 inline ，即為“行內(nèi)”；設為 block，即為“塊級”；設為none,即為“無”，也就是隱藏盒子。17、圓

10、角框主要有哪幾種制作方法？兩背景圖像法、四圖像不固定寬度圓角框、五圖像二維滑動門圓角框。18、使用CSS主要有哪幾種布局方式?兩列布局、三列布局、多列布局。19、CSS布局方法與表格布局方法相比，有哪些優(yōu)勢？（1）頁面載入更快；（2）降低網(wǎng)站流量費用； （3）易于修改； （ 4）視覺一致（ 5）更易于被搜索引擎找到。20、使用CSS布局的網(wǎng)頁應實現(xiàn)哪些要求?（1）（2）寬度使用多列布局，并保證頁頭和頁腳正確顯示； 可以指定列寬度固定，其余列寬度自適應； 在 html 中，個列可以任意順序排列，最終效果都正確顯示。案例分析題（3）81、解釋以下 CSS 樣式的含義。tableborder: 1p

11、x #333 solid; font: 12px arial;width: 500pxtd,thpadding: 5px;border: 2px solid #EEE; border-bottom-color: #666;border-right-color: #666;將表格邊框?qū)挾仍O為1px，顏色設為#333,邊框為實線；表格中的字體大小設為 12px,字體類型為arial;表格寬度為500px。設置單元格和表頭部分的樣式：內(nèi)邊距為5px,邊框?qū)挾?px,實線，顏色為#EEE， 底部和右側邊框顏色特別設為 #666 2、解釋以下 CSS 樣式的含義。formborder:1px dotte

12、d #AAAAAA; padding:3px 6px 3px 6px; margin:0px;font:14px Arial; selectwidth:80px; background-color:#ADD8E6;設置表單邊框?qū)挾葹?px,點劃線，顏色為#AAAAAA，內(nèi)上、右、下、左邊距分別為：3px 6px 3px 6px，外邊距為Opx，字體為14px大小的Arial字體。設置選擇框?qū)挾葹?0px,背景顏色為#ADD8E63、解釋以下 CSS 樣式的含義。inputcolor:#00008B;inpu t.bt nbackgrou nd-color:#ADD8E6;p add in g:

13、1 px 2px 1px 2px;設置input標簽中字體顏色為#00008B；input標簽中id屬性為btn的按鈕背景顏色設為#ADD8E6，內(nèi)上、右、下、左邊距分別設為1px、2pX、1px、2px4、解釋以下CSS樣式的含義。.roun ded backgro und: url(images-no tebook/left-t op .gif) top left no-rep eat;.roun ded h2 backgro und: url(images-no tebook/right-t op .gif) top right no-rep eat;paddi ng:20 px 20p

14、x 10p x;margi n:0;定義類選擇器.rounded：背景圖像為left-top.gif,從左上角開始，不平鋪定義后代選擇器.rounded h2：背景圖像為right-top.gif,從右上角開始，不平鋪; 內(nèi)上、左右、下邊距分別是 20px 20px 10px，外邊距為06畫出一個(1+( 3-1-2) -1的布局結構示意圖。5、畫出一個1- (1-2) +1) -1的布局結構示意圖。1 11 11 1111 1111-7、解釋以下 CSS 樣式的含義。#header,#pagefooter,#containermargin:0 auto;width:85%;#contentp

15、osition:absolute;width: 300px;設置 id 屬性為 header、pagefooter、container 的 div 層上下外邊框為 0，左右外邊框為auto,寬度為相對于父元素寬度的 85%設置id屬性為content的div層為絕對定位，寬度為固定寬度 300px 8、解釋以下 CSS 樣式的含義。A:link COLOR: #3333cc; TEXT-DECORATION: none COLOR: #990099; TEXT-DECORATION: none COLOR: #ff0000; TEXT-DECORATION: underline COLOR:

16、#3333cc; TEXT-DECORATION: underline A:visited A:active A:hover 設置超鏈接樣式： 未操作時：顏色為#3333cc無下劃線； 單擊過后：顏色為 #990099，無下劃線； 單擊時：顏色為# ffOOOO,有下劃線； 懸停時：顏色為# 3333CC有下劃線；9、寫出下列要求的 CSS 樣式表（1）設置頁面背景圖像為login_back.gif，并且背景圖像垂直平鋪。（2） 使用類選擇器，設置按鈕的樣式，按鈕背景圖像：login_submit.gif;字體 顏色：#FFFFFFF;字體大?。?4px;字體粗細：bold;按鈕的邊界、邊框和填 充均為 Opx。body background-image:url（img/login_back.gif）; background-repeat:repeat-y; .picButtonbackground-image:url(img/login_submit.gif); color:#FFFFFF;font-size: 14px;font-weight:bold;margin: 0px;border:0px;padding: 0px; 10、寫出下列