css应该写在html语言的哪个标记里,CSS布局的选择题

1.如何能够定义列表的项目符号为实心矩形( )

A. list-type: square

B. type: 2

C. type: square

D. list-style-type: square

D

2.在HTML页面中，要通过无列表符号实现横向的导航菜单,不需要使用到的css属性是( )

A. list-style

B. padding

C. z-index

D. float

C

3.下列哪个属性能够设置盒模型的左侧外边距( )

A. margin:

B. indent:

C. margin-left:

D. text-indent:

C

4.怎样使一个层垂直居中于浏览器中？(　)

A．padding: 50％ 50％.

B．margin: 50% 50%

C．margin: 0 auto

D．margin: -100 auto

B

5.下面选项中，可以设置页面中某个DIV标签相对页面水平居中的CSS样式是(　)。

A．margin:0 auto

B．padding:0 auto

C．text-align:center

D．vertical-align:middle

A

6.为了让以下id为container的div能够水平居中，需要的CSS样式是( )

页面正文

A. #container{width:880px; padding:0px auto;}

B. #container{width:880px;padding:auto 0px;}

C. #container{width:880px;margin:auto 0px;}

D. #container{width:880px;margin:0px auto;}

D

7.定义盒模型外边距的时候是否可以使用负值?

A. 是

B. 否

A

8.下列关于CSS中盒子模型说法错误的是( )

A. 盒子模型是页面布局的基础，它包括外边距、边框、内边距以及元素的宽高等属性

B. border代表盒子内容本身的宽度

C. margin代表内容与边框间的距离

D. padding代表盒子与其他盒子之间的距离

A

9.display属性的属性值共有( )

A. 18个

B. 4个

C. 6个

D. 12个

A

10.以下声明，可以隐藏对象的是( )

A. display:block

B. display:inline

C. display:none

D. display:inline-block

C

11.关于float描述错误的是

A. float:left;

B. float:center

C. float:right

D. float:none;

B

12.在HTML中，DIV默认样式下是不带滚动条的，若要使

标签出现滚动条，需要为该标签定义(　)样式。

A．overflow:hidden

B．display:block;

C．overflow:scroll;

D．display:scroll;

C

13.阅读下面的HTML代码，下面选项中增加的样式可以使两个DIV不在同一行显示的是(　)。 ……

A．.box2{ clear:left; }

B．.box2{ clear:both; }

C．.box1{ clear:right; }

D．.box2 { clear:right; }

B

14.在HTML中，以下关于position属性的设定值描述错误的是( )

A. static为默认值，没有定位，元素按照标准流进行布局

B. relative属性值设置元素的相对定位，垂直方向的偏移量使用up或down属性来指定

C. absolute表示绝对定位，需要配合top、right、bottom、left属性来实现元素的偏移量

D. 用来实现偏移量的left和right等属性的值，可以为负数

B

15.在HTML中，盒子模型中元素实际展位的高度应该为( )

A.height属性 + padding-top + padding-bottom

B.height属性 + padding-top + padding-bottom +border-top + border-bottom

C.height属性 + margin-top + margin-bottom + border-top + border-bottom

D.height属性 + padding-top + padding-bottom + border-top + border-bottom + margin-top + margin-bottom

D

16.CSS对大小写敏感(CSS区分大小写)吗？

A. 是

B. 否

B

17.对行内元素设置margin-top或margin-bottom属性是否有效？

A. 是

B. 否

B

18.对行内元素设置padding-top或padding-bottom属性是否有效？

A. 是

B. 否

B

19.假设对＜p＞元素设置样式font-size:10rem，当用户改变浏览器窗口大小时，该元素内字体大小是否会随着窗口大小变化而发生变化？

A. 是

B. 否

B

20.伪类:checked仅适用于type属性为radio或checkbox的input表单，并不适用于＜option＞表单，该说法正确吗？

A. 正确

B. 错误

B

21.在HTML文档中，伪类:root永远是＜html＞元素，该说法正确吗？

A. 正确

B. 错误

A

22.translate()方法可以在z轴方向上移动元素的位置，该说法正确吗？

A. 正确

B. 错误

B

23.有如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

ul {

color: red;

}

li {

color: blue;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

24.有如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

ul li {

color: red;

}

#must-buy {

color: blue;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

B

25.如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

.shopping-list .favorite {

color: red;

}

#must-buy {

color: blue;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

B

26.有如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

ul#awesome {

color: red;

}

ul.shopping-list li.favorite span {

color: blue;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

B

27.有如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

ul#awesome #must-buy {

color: red;

}

.favorite span {

color: blue!important;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

B

28.有如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

ul.shopping-list li .highlight {

color: red;

}

ul.shopping-list li .highlight:nth-of-type(odd) {

color: blue;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

B

29.有如下代码：

//HTML代码

＜ul class=”shopping-list” id=”awesome”＞

＜li＞＜span＞Milk＜/span＞＜/li＞

＜li class=”favorite” id=”must-buy”＞＜span class=”highlight”＞Sausage＜/span＞＜/li＞

＜/ul＞

//CSS代码

#awesome .favorite:not(#awesome) .highlight {

color: red;

}

#awesome .highlight:nth-of-type(1):nth-last-of-type(1) {

color: blue;

}

文本Sausage将呈现什么颜色？

A. 红色

B. 蓝色

C. 以上都不是

A

30.有如下代码：

//HTML代码

＜p id=”example”＞Hello＜/p＞

//CSS代码

#example {

margin-bottom: -5px;

}

元素#example的位置将会发生什么变化？

A. 下移5px

B. #example所有的后继节点将上移5px

C. 以上都不是

B

31.有如下代码：

//HTML代码

＜p id=”example”＞Hello＜/p＞

//CSS代码

#example {

margin-left: -5px;

}

元素#example的位置将会发生什么变化？

A. 左移5px

B. #example所有父元素将右移5px

C. 以上都不是

A

32.有如下代码：

//HTML代码

＜div id=”test1″＞

＜span id=”test2″＞＜/span＞

＜/div＞

//CSS代码

#i-am-useless {

background-image: url(＇mypic.jpg＇);

}

未使用的样式表里的资源文件是否会被浏览器下载？

A. 是

B. 否

B

33.有如下代码：

//HTML代码

＜div id=”test1″＞

＜span id=”test2″＞＜/span＞

＜/div＞

//CSS代码

#test2 {

background-image: url(＇mypic.jpg＇);

display: none;

}

页面加载时，图片mypic.jpg是否会被浏览器下载？

A. 是

B. 否

A

34.有如下代码：

//HTML代码

＜div id=”test1″＞

＜span id=”test2″＞＜/span＞

＜/div＞

//CSS代码

#test1 {

display: none;

}

#test2 {

background-image: url(＇mypic.jpg＇);

visibility: hidden;

}

页面加载时，图片mypic.jpg是否会被浏览器下载？

A. 是

B. 否

B

35.有如下代码：

//CSS代码

@media only screen and (max-width: 1024px) {

margin: 0;

}

选择器only的作用是：

A. 阻止老版本浏览器解析剩下的选择器

B. 仅对屏幕设备应用样式，忽略设备的max-width

C. 什么都不做

A

36.有如下代码：

//HTML代码

＜div＞

＜p＞I am floated＜/p＞

＜p＞So am I＜/p＞

＜/div＞

//CSS代码

div {

overflow: hidden;

}

p {

float: left;

}

样式overflow: hidden是否会创建一个新的块格式上下文？

A. 是

B. 否

A

37.有如下代码：

//CSS代码

@media only screen and (max-width: 1024px) {

margin: 0;

}

关键字screen是适用于设备的物理屏幕还是浏览器的窗口：

A. 设备物理屏幕

B. 浏览器窗口

B

38.＜keygen＞是否是合法的HTML 5标签？

A. 是

B. 否

A

39.＜bdo＞标签是否改变文本方向？

A. 是

B. 否

A

40.有如下代码：

//HTML代码

＜figure＞

＜img src=”myimage.jpg” alt=”My image”＞

＜figcaption＞

＜p＞This is my self portrait.＜/p＞

＜/figcaption＞

＜/figure＞

以上HTML代码是否合法：

A. 是

B. 否

A

41.在以下什么情况下可以使用＜small＞标签：

A. 当需要在＜h1＞标签之后创建子标题时

B. 当需要在＜footer＞标签内添加版权信息时

B

42.一个网页上含有结构性完整的多个＜h1＞标签，是否会优化SEO：

A. 是

B. 否

B

43.一个搜索结果页包含多条搜索结果，用哪个HTML标签突出标记搜索词：

A. ＜strong＞

B. ＜mark＞

C. ＜em＞

D. ＜highlight＞

B

44.有如下代码：

//HTML代码

＜article＞

＜h1＞Hello World＜/h1＞

＜style scoped＞

p {

color: #FF0;

}

＜/style＞

＜p＞This is my text＜/p＞

＜/article＞＜article＞

＜h1＞This is awesome＜/h1＞

＜p＞I am some other text＜/p＞

＜/article＞

属性scoped有什么作用？

A. 将样式规则应用于与元素居右相同父节点的后继节点上

B. 将样式规则应用于scoped标记的父元素的所有子节点

C. 仅将样式规则应用于IE浏览器

B

45.有如下代码：

//HTML代码

＜article＞

＜a href=”#”＞

＜h1＞Hello＜/h1＞

＜p＞I am some text＜/p＞

＜/a＞

＜/article＞

HTML 5是否支持块级链接？

A. 是

B. 否

A

46.有如下代码：

//HTML代码

＜img src=”mypic.jpg” style=”visibility: hidden” alt=”My picture”＞

以上HTML代码是否会触发HTTP请求？

A. 是

B. 否

A

47.有如下代码：

//HTML代码

＜div style=”display: none;”＞

＜img src=”mypic.jpg” alt=”My photo”＞

＜/div＞

以上HTML代码是否会触发HTTP请求？

A. 是

B. 否

A

48.有如下代码：

//HTML代码

＜head＞

＜link href=”main1.css” rel=”stylesheet”＞

＜script＞

alert(＇Hello World＇);

＜/script＞

＜/head＞

在Hello World被alert出来之前，main1.css文件是否被浏览器下载并解析？

A. 是

B. 否

A

49.有如下代码：

//HTML代码

＜head＞

＜link href=”main1.css” rel=”stylesheet”＞

＜link href=”main2.css” rel=”stylesheet”＞

＜/head＞

在main2.css文件被获取之前，main1.css文件必须先被浏览器下载并解析？

A. 是

B. 否

B

50.有如下代码：

//HTML代码

＜head＞

＜link href=”main1.css” rel=”stylesheet”＞

＜/head＞

＜body＞

＜p＞Paragraph 1＜/p＞

＜p＞Paragraph 2＜/p＞

＜link href=”main2.css” rel=”stylesheet”＞

＜/body＞

在Paragraph 1被渲染之前，main1.css文件是否被浏览器下载并解析？

A. 是

B. 否

A