目    录

任务一：盒子模型... 2

任务二：盒子的定位和浮动... 2

任务三：列表... 2

任务四：表格... 2

任务五：表单... 2

任务六：超链接

岗课赛证习题

1、下列选项中，用于改变盒子模型外边距的是（    ）。

A. margin    B. padding   C. type    D. border

2、下列选项中，用于改变盒子模型内边距的是（    ）。

A. margin    B. padding   C. type    D. border

3、下列选项中，用于更改元素左边框的是（    ）。

A. text-indent    B. border-left   C. margin-left    D. padding-right

4、下列样式代码中，用于定义盒子上边框为1像素、蓝色、单实线的是（    ）。

A. border-top:1px solid blue;    B. border:1px solid blue;   

C. border-top:1px dashed blue;  D. border:1px dashed blue;

5、在下列选项中，对代码“ margin:10px 0 20px;”解释正确的是（    ）。

A. 上间距10px，左右间距0，下间距20px  

B. 上间距10px，左间距0，右间距20px

C. 上下间距10px，左间距0，右间距20px

D. 上下间距10px，左间距20px，右间距0

6、下面的选项中, 表示元素距离上下左右的外边距都是10px的是哪一项？（    ）。

A. {padding:10px;}      B. {margin: 10px 0;} 

C. {padding: 10px 0;}    D. {margin: 10px;}

7、下面的选项中, 表示元素距离上下左右的外边距都是10px的是哪一项？（    ）。

A. font-size:0;      B. line-height:0;

C. padding:0;      D. margin:0;

8、下列选项中，用于设置边框样式的属性是（）。

A. border-style     B. border-height

C. border-width     D. border-color

9、下列选项中，用于设置边框宽度的属性是（）。

A. border-style     B. border-height

C. border-width     D. border-color

10、下列选项中，用于设置边框颜色的属性是（）。

A. border-style     B. border-height

C. border-width     D. border-color

11、下列选项中，用于更改元素左内边距的是（）。

A. text-indent    B. padding-left

C. margin-left    D. padding-right

12、下列选项中，可清除元素默认外边距的是（）。

A. font-size:0;   B. line-height:0;

C. padding:0;   D. margin:0;

13、下列选项中，用于设置盒子背景颜色的属性的是（）。

A. background-color      B. background-image

C. background-repeat     D. background-position

14、下列选项中，用于设置背景图像位置的属性是（）。

A. background-color      B. background-image

C. background-repeat     D. background-position

15、关于background-position属性值，下列书写正确的是（）。

A. p{ background-position:left top; }      B. p{ background-position:left 10; }

C. p{ background-position:10 top ;}       D. p{ background-position:top 10 ;}

16、下列选项中，可以控制盒子宽度的属性是（）。

A. width     B. height      C. padding      D. margin

17、关于盒子模型中的宽度属性，下面说法正确的是（）。

A. 盒子模型中的宽度属性适用于所有元素    

B. 盒子模型中的宽度属性仅适用于行内元素

C. 盒子模型中的宽度属性仅适用于块级元素

D. 以上说法都正确

18、关于盒子模型中的宽度属性，下面说法正确的是（）。

A. 盒子模型中的宽度属性适用于所有元素 

B. 盒子模型中的宽度属性仅适用于行内元素

C. 盒子模型中的宽度属性仅适用于块级元素

D. 以上说法都正确

19、关于盒子模型中的高度属性，下面说法正确的是（）。

A. 盒子模型中的宽度属性适用于所有元素 

B. 盒子模型中的宽度属性仅适用于行内元素

C. 盒子模型中的宽度属性仅适用于块级元素

D. 以上说法都正确

20、下列选项中，用于设置圆角边框的属性是（）。

A. border-style     B. border-height

C. border-radius    D. border-color

21、下列选项中，给盒子添加阴影效果的属性是（）。

A. box-shadow    B. box-sizing

C. shadow        D. sizing

22、下面选项中，属于盒子模型基本属性的是（）。

A. 内边距    B. 外边距

C. 边框       D. 宽和高

23、在盒子模型中，边框是一个重要的属性，下列选项中属于边框属性的是（）。

A. border-style      B. border-height

C. border-width     D. border-color

24、关于样式代码“padding:20px 30px 10px;”，下列说法正确的是（）。

A. 该元素上下方向的内边距均为20px    B. 该元素的上内边距为20px

C. 该元素左右内边距为30px    D. 该元素下内边距为10px

25、盒子模型有多个属性，其中元素内容与边框之间的距离通常被称为（）。

A. 内边距   B. 内填充

C. 外边距   D. 外填充

26、background-repeat的属性值包括以下哪些选项（）。

A. repeat  B. no-repeat

C. repeat-x  D. repeat-y

27、下列选项中，用于设置颜色不透明度的是（）。

A. rgba模式       B. opacity属性

C. RGB           D. CMYK

28、下列选项中，用于设置颜色不透明度的是（）。

A. inline       B. block

C. inline-block          D. none

（网页布局）

1、DIV+CSS布局常用属性包括（  ）和（  ）

A. 浮动    B. div   C. 定位    D.CSS

2、元素浮动后，会脱离标准流的控制。

A. 正确   B. 错误 

3、float属性包括三种，分别是（  ）

A.left    B. center  C. right    D.none

4、块级元素添加float属性后会变成行内块元素。

A. 正确   B. 错误 

5、行元素添加float属性后，会变成行内块元素，比如，超链接元素a添加float属性后就变成了行内块元素。

A. 正确   B. 错误 

6、清除浮动的本质是为了解决父级元素因为子级元素浮动而引起的高度为0的问题。

A. 正确   B. 错误 

7、清除浮动常用的方法是（  ）和（  ）。

A. 在浮动元素之和添加空标签，并对该标签设置属性：clear:both;   

B.在父元素的样式里添加：clear:both; 

C. 在父元素的样式里添加：overflow:hidden;  

D. 以上都不对。

8、在CSS中，通过定位属性（ ）可以实现网页中元素的精确定位。

A. backgroun-position    B. float   C. position    D. color

9、若要给盒子添加绝对定位，则下面样式的写法正确的是（   ）

A. position : static;   B. position : relative;   

C. position : absolute;   D. position : fixed;

10、要给盒子添加相对定位，则下面样式的写法正确的是（   ）

A. position : static;   B. position : relative;   

C. position : absolute;   D. position : fixed;

11、要给盒子添加固定定位，则下面样式的写法正确的是（   ）

A. position : static;   B. position : relative;   

C. position : absolute;   D. position : fixed;

12、脱离标准流的定位模式是（   ）

A. 静态定位   B. 固定定位   C. 绝对定位    D.相对定位

13、“子绝父相”的含义是：若子级元素设置绝对定位，则父级元素应设置（   ）

A. 静态定位   B. 固定定位   C. 绝对定位    D.相对定位

14、若要让图片定位在设置了相对定位的父盒子的左上角，则下面的样式设置正确的是（  ）

A. position:absolute;  top:0;  left:0;

B. position:absolute;   top:0;   right:0;   

C. position:absolute;    bottom:0;   left:0;

D. position:absolute;  bottom:0;   right:0;

15、若为四个设置了绝对定位的元素设置堆叠顺序，则下面哪个元素在最上面（  ）。

A. z-index:0;   B. z-index:1;   C. z-index:2;    D. z-index:3;

16、下面哪种定位模式下，元素边偏移的参照物只能是浏览器（  ）。

A. static  B. relative  C. absolute  D. fixed

17、设置了绝对、相对或固定定位的元素，直接变成了（  ）。

A. 块元素    B. 行内块元素  C. 行元素  D. 块内行元素

18、下列元素属于块元素的是（  ）

A.

19、下列元素属于块元素的是（  ）

A.

20、下面能把行元素转化为块元素的是（   ）

A. display:inline;    B. display:block;  C. display:inline-block;  D. display:none;

21、相邻块元素之间的垂直间距是（   ）

A. margin-bottom和margin-top之和   B. margin-bottom和margin-top之差

C. margin-bottom和margin-top两者中的较大者   

D. margin-bottom和margin-top两者中的较小者

22、对于两个嵌套关系的块元素，不让父元素的上外边距与子元素的上外边距发生合并，则需要给父元素加上（   ）或（  ）

A. 上外边距    B. 上内边距 C. 边框   D. 底纹

23、下列选项中，属于float属性值的有（）。

A. left   B. center    C. right     D. none

24、在div+css布局技术中，下列选项属于边偏移属性的是（  ）。

A. left   B. center    C. right     D. positon

25、下列样式代码中，可精确定义元素位置的是（）。

A. .special{ position: absolute;}      B. .special{ position: absolute; top:20px; left:16px;}    C. .special{ position: relative; top:20px; left:16px;}     D. .special{ position: relative;}

26、关于Z-index标签层叠的描述，下列说法正确的是（）。

A. z-index属性取值可为正整数      B. z-index属性取值可为负整数  

C. z-index属性取值可为0            D. z-index属性取值不可以为0

1、下面可以定义无序列表的标签是（  ）

A. ul    B. ol   C. dl   D. dd

2、每对

A.

3、

    

• 咖啡

      

     

        

1. 拿铁
          

      

上面的嵌套关系正确吗？（   ）

A.正确  B. 错误 

4、关于定义无序列表的基本语法格式，下列书写正确的是（）。

A.

• 列表项1
• 列表项2
......

B.

列表项1
列表项2
......

C.

列表项1 列表项2

D.

列表项1

列表项2

5、下列代码中，能够将列表项目符号设置为大写英文字母的是（）。

A. ul{ list-style-type: lower-alpha;}    

B. ol{ list-style-type: lower-alpha;}

C. ul{ list-style-type: upper-alpha;} 

D. ol{ list-style-type: upper-alpha;}

6、关于list-style-image属性，下列说法正确的是（）。

A. 可以为各个列表项设置列表项目图像  

B. 用于控制列表项显示符号的类型

C. 只可以为无序列表的列表项设置项目图像

D. 只可以为有序列表的列表项设置项目图像

7、关于list-style-image属性的基本格式，下列书写正确的是（）。

A. list-style-image:url(图片位置);  

B. list-style-image: (图片位置);

C. list-style-image:;

D. list-style-image: src(图片位置);

8、列表项目符号可以显示为“■”且位于列表文本以内的代码是（）

A. list-style:circle inside;

B. list-style:square inside;

C. list-style:circle outside;

D. list-style:square outside;

9、下列选项中，可以设置列表项目符号位于列表文本以内的是（）。

A. list-style-position:inside;

B. list-style-position:outside;

C. list-style-position:none;

D. list-style-position:0;

10、关于无序列表的描述，下列说法正确的是（）。

A. 无序列表的各个列表项之间没有顺序级别之分

B. 无序列表使用

标签表示

C. 无序列表使用

标签表示

D. 无序列表使用

标签表示

11、在定义列表的基本语法中，

标签中需要嵌套（   ）标签。

A.

B.

C.

D.

12、下列关于列表项目符号的说法正确的是（）。

A. list-style-type属性用来更改列表的项目符号类型

B. 无序列表的项目符号默认为“●”

C. list-style-type属性没有任何兼容性问题，所以书写HTML页面时可以放心应用

D. list-style-type属性只能更改无序列表的项目符号

13、下列选项中，属于list-style-type属性值的是（）。

A. disc

B. square

C. alpha

D. upper-roman

14、下列标签属性中，能够用于实现列表项目图像的是（）。

A. list-style-image

B. background

C. img

D. float

15、列表项目符号可以显示为“■”且位于列表文本以内的代码是（）

A. list-style:circle inside;

B. list-style:square inside;

C. list-style:circle outside;

D. list-style:square outside;

16、关于list-style-position属性，下列说法正确的是（）。

A. 用于控制列表项目符号的位置

B. 其属性值为inside时，列表项目符号位于列表文本以内

C. 其属性值为outside时，列表项目符号位于列表文本以外

D. 其取值有inside和outside两种

17、下列选项中，可以设置列表项目符号位于列表文本以外的是（）。

A. list-style-position:inside;

B. list-style-position:outside;

C. list-style-position:0;

D. 不设置list-style-position属性

18、下列选项中，可以设置列表项目符号位于列表文本以内的是（）。

A. list-style-position:inside;

B. list-style-position:outside;

C. list-style-position:none;

D. list-style-position:0;

 

 




1、能够创建表格的标签是（   ）

A. tr   B. td   C. table   D. th

2、可以设置table标签背景颜色的属性是（   ）

A. backgroundColor   B. background-color   C. bgcolor   D. cellspacing

3、（   ）不是tr标签的属性。

A. height   B. width   C. valign   D. background

4、colspan用于合并（）方向的单元格。

A. 水平   B. 垂直   C. 水平和垂直   D. 以上都不是

5、rowspan用于合并（）方向的单元格。

A. 水平   B. 垂直   C. 水平和垂直   D. 以上都不是

6、th用来设置表格的（   ）

A.创建表格  B. 设置行   C. 设置列   D. 设置表头

7、下列选项中，属于创建表格的基本标签是（）。

A.

     B.   C.    D.

8、在下列标签的属性中，可以用来合并单元格的是（）。

A. col     B. cols     C. rowspan      D. colspan

9、下列选项中，属于标签属性的是（）。

A. width    B.height    C. rowspan      D. colspan

10、下列标签中，用于划分表格结构的是（）。

A.    B.      C.      D.

11、CSS代码：“table{border:1px solid red;}”属于上述代码的含义是（）。

A. 设置table的边框为一像素的红色实线 

B. 设置单元格的边框为一像素的红色实线    

C. 设置table的边框为一像素的红色虚线   

D. 设置单元格的边框为一像素的红色虚线

12、关于CSS控制单元格边距，下列说法错误的是（）。

A. 单元格设置外边距属性margin不能生效

B. 单元格设置内边距属性padding不能生效   

C. table标签可以设置内边距padding和外边距margin属性，并且均能生效   

D. 行标签无内边距属性padding和外边距属性margin

13、下面的代码中，可以设置单元格宽度的是（）。

A. td{width:50px;}     B. td{height:50px;}     

C. td{line-height:50px;}    D. td{font-size:50px;}

 




1、若要实现下面的控件分组，用到的标签是（   ）



A.datalist  B. fieldset   C. optgroup   D. 以上都不是

2、若要实现留言功能，需要使用的标签是（  ）



A.select  B. input   C. textarea   D. option

3、若要把input控件的蓝色轮廓线去掉，则使用的属性是（  ）

A. outline:0;   B. outline:none;   C. border:0;    D. border:none;

4、下面（  ）属性可以把下拉菜单变成下拉列表。

A.multiple   B. size   C. selected   D. name

5、把控件设置为禁用的属性是（  ）。

A.disabled     B. readonly  C. selected   D. name

6、定义下拉菜单的标签是（  ）

A. textarea    B. input  C. selected   D. option

7、下列选项中，属于表单构成的基本元素是（）。

A. 表单控件   B. 提示信息    C. 表单域  D. 文本域

8、下列选项中，属于表单控件的是（）。

A. 单行文本输入框   B. 密码输入框    C. 复选框  D. 提交按钮

9、下列选项中，属于表单标签

的属性是（）。

A. action      B. size   C. method    D. name

10、下列选项中，用来定义下拉列表的是（）。

A.      B.    C.     D.

11、下列选项中，属于input控件的是（）。

A. 单行文本输入框    B. 单选按钮  C. 复选框    D. 提交按钮

12、下列选项中，属于input控件属性的是（）。

A. type   B. name  C. value    D. size

13、下列选项中，属于标签的必须属性的是（）。</p><p>A. cols   B. rows    C. value   D. size</p><p>14、下列选项中，属于<option>标签属性的是（）。</p><p>A. multiple  B. selected   C. value   D. size</p><p>15、下列选项中，用于输入搜索关键词的文本框的控件类型是（）。</p><p>A. email类型<input type="email" />    B. url类型<input type="url" />  </p><p>C. search 类型<input type="search" />   D. color类型<input type="color" /></p><p> </p><p><br></p><p>1、创建超链接的标签是（   ）</p><p style="text-indent: 28px">A. a    B. p   C. div   D. span</p><p>2、超链接标签a中必不可少的属性是（   ）</p><p style="text-indent: 28px">A. target     B. width     C. style     D. href</p><p>3、可以创建超链接的元素是（   ）</p><p style="text-indent: 28px">A. 文本     B. 表格     C. 图像     D. 以上都是</p><p>4、链接伪类中（   ）可以设置超链接鼠标经过、悬停时的状态。</p><p style="text-indent: 28px">A. a:link     B. a:visited     C. a:hover     D. a:active</p><p>5、清除超链接的下划线使用的属性是（   ）。</p><p style="text-indent: 28px">A. text-decoration:under-line;    B. text-decoration:none;    </p><p style="text-indent: 28px">C. text-decoration:online;        D. text-decoration:no；</p><p>6、用于指定超链接页面的打开方式的属性是（  ）</p><p style="text-indent: 28px">A. href     B. target     C. style    D. herf</p><p>7、关于创建锚点链接的代码，下列书写正确的是（）。</p><p>A. <a href="#one">链接文本</a>………<h3 id="one">锚点链接 </h3>   </p><p>B. <a href="#id">链接文本</a>………<h3 id="one">锚点链接 </h3>     </p><p>C. <a href="#">链接文本</a>………<h3 id="one">锚点链接 </h3></p><p>D. <a href="#one">链接文本</a>………<h3 id="#one">锚点链接 </h3></p><p>8、关于创建锚点链接的代码，下列书写正确的是（）。</p><p>A. 关于链接伪类的描述，下列说法错误的是（）。</p><p>B. a:visited{}表示访问后超链接的状态    </p><p>C. a:hover{}表示鼠标经过、悬停时超链接的状态</p><p>D. a:active{}表示鼠标点击不动时超链接的状态</p><p><br></p>