智能专项练习--HTML+CSS+bootstrap（2）

1、以下代码做什么？

<input type=”text” name=”user_name” antofocus=”autofocus”/>

正确答案: A 

页面加载后，浏览器将自动聚焦user_name字段

都不正确

表单加载时创建一个text字段

加载一个text表单

2、用于预格式化文本的标签是

正确答案: B  

<meta>

<pre>

<mark>

<small>

3、下列哪一项不是 HTML5 中新增加的标签？（）

正确答案: C   

nav

article

caption

video

解：H5新标签：

<article></article>

<aside></aside>

<audio src="someaudio.wav"></audio>

<canvas id="myCanvas" width="200" height="200"></canvas>

<command onclick=cut()" label="cut">

<datalist></datalist>

<details></details>

<embed src="horse.wav" />

<figure><figcaption>PRC</figcaption></figure>

<figure><figcaption>PRC</figcaption><p>The People's Republic of China was born in 1949...</p></figure>

<footer></footer>

<header></header>

<hgroup></hgroup>

<keygen>

<mark></mark>

 <meter></meter>

<nav></nav>

<output></output>

<progress></progress>

<ruby>漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>

<ruby>漢 <rt> ㄏㄢˋ </rt></ruby>

<ruby>漢 <rt><rp>(</rp>ㄏㄢˋ<rp>)</rp></rt></ruby>

<section></section>

 <source>

 <details><summary>HTML 5</summary>This document teaches you everything you have to learn about HTML 5.</details>

<time></time>

<video src="movie.ogg" controls="controls">您的浏览器不支持 video 标签。</video>

4、下面有关CSS中link和@import的区别，描述错误的是？

正确答案: D  

link属于XHTML标签，而@import完全是CSS提供的一种方式

当一个页面被加载的时候，link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再被加载

link在支持CSS的浏览器上都支持而@import只在5.0以上的版本有效

当使用javascript控制dom去改变样式的时候，只能使用@import方式

解：

1，@import url（）机制是不同于link的，link是在加载页面前把css加载完毕，而@import url（）则是读取完文件后在加载，所以会出现一开始没有css样式，闪烁一下出现样式后的页面(网速慢的情况下)。  

2，@import 是css2里面的，所以古老的ie5不支持。  

3，当使用javascript控制dom去改变样式的时候，只能使用link标签，因为@import不是dom可以控制的。

4，link除了能加载css外还能定义RSS，定义rel连接属性，@import只能加载css  

5、表单提交时会触发什么Dom事件

正确答案: A   

submit

onsubmit

onupload

onresize

解：onsubmit只是一种绑定方式，注意！

6、下面属于CSS3新增属性的有？

正确答案: A C D  

box-shadow

text-shadow

border-radius

rgba

7、以下代码符合html5规范的是

正确答案: B

<div><span></div>

<input type=”text” disabled>

<label id=”mylabel”></label>

<div myname=”javk”></div>

解：labe标签只有两个属性，for和form

8、以下标签，错误的是

正确答案: C

text-left用于左对齐

text-center水平居中对齐

text-vertical垂直居中对齐

text-uppercase可以将字母全部大写

解：垂直居中对其是vertical-align

9、当margin-top、padding-top的值是百分比时，分别是如何计算的？【注意！！】

正确答案: D

相对父级元素的height，相对自身的height

相对最近父级块级元素的height，相对自身的height

相对父级元素的width，相对自身的width

相
af6c
对最近父级块级元素的width，相对最近父级块级元素的width

原因：如果将元素的margin-top和margin-bottom，padding-top及padding-bottom是相对于最近父级块级的高度计算，那么就会造成一个死循环，如果父级元素的高度随着子元素的增多而高度增加，则设置了百分比的子元素的高度将会发生变化，父级元素的高度又会增加......如此循环。。

10、head 标签中必不少的是（ ）

正确答案: C 

<meta>

<link>

<title>

<script>

11、给定下面的 HTML 代码：

<div id=”wrapper”>

<div class=”wText”>…</div>…<!—more wText items here -->

<div class=”wImg”>…</div>…<!—more wImg items here -->

<div class=”wVideo”>…</div>…<!—more wVideo items here -->

</div>

怎么能够取得 ”wrapper” 中全部项的集合？

正确答案: C

$(‘#wrapper’).children();

$(‘#wrapper’).html();

$(‘#wrapper’).contents();

$(‘#wrapper’).find(“all”);

12、不换行必须设置哪些项？

正确答案: A C

word-break

letter-spacing

white-space

word-spacing

解：word-break:break-all,用于处理单词折断。 

white-space:no-wrap用于处理元素内的空白，只在一行内显示。

13、下列 media queries 的定义方式中，哪一个是适配 iphone6s 的？（）

正确答案: B

．@media(min-device-width:375px) and(max-device-width:667px) and(-webkit-min-device-pixel-ratio:2){}

．@media(min-device-width:414px) and(max-device-width:736px) and(-webkit-min-device-pixel-ratio:3){}

@media only screen and (min-device-width:320px) and (max-device-width:480px) and (-webkit-device-pixel-ratio:2){}

@media only screen and (min-device-width:320px) and (max-device-width:568px) and (-webkit-min-device-pixel-ratio:2){}

14、下面关于IE、FF下面CSS的解释区别描述正确的有？

正确答案: C D 

FireFox的div的内嵌div可以把父级的高度撑大，而IE6.0不可以，要自己设置高度。

当设置为三列布局时，FireFox0的float宽度不能达到100％，而IE6.可以。当设置为两列布局时，两种浏览器都可以。

火狐浏览器中，非float的div前面有同一父级的float的div，此div若有背景图，要使用clear：both，才能显示背景图，而IE6.0中不用使用clear：both

在[text-decoration:underline]的属性下，IE6.0显示的下划线会比FireFox低一点。在FireFox中，部分笔画会在下划线的下面1个象素左右。

解：A中IE可以，Firefox不可以

B中三列布局时，IE6可以，Firefox不可以

15、如果一个HTML文档内含有阿拉伯文，则应该（）

正确答案: A

使用utf8编码

将阿拉伯文转为图片并嵌入到文档内

使用GBK编码

使用iso-8859-2编码

16、下面span标签中Hello World字体的颜色是：（）

<style type="text/css">

span {

    color: green;

}

.red {

    color: red;

}

#blue {

    color: blue;

}

</style>

<span id="blue" class="red" style="color:black;">Hello World</span>

正确答案: D

green

red

blue

black

解：内联>ID>类>标签

17、哪些可以给文字加上背景？

正确答案: A B C D

bg-primary

bg-success

bg-info

bg-warning

解：主要蓝（bg-primary）、成功绿（bg-success）、信息蓝（bg-info）、警告黄（bg-warning）、危险红（bg-danger）

18、在不涉及样式情况下,页面元素的优先显示与结构摆放顺序无关。请判断这句话的正确与否。

正确答案: B

T

F

解：在不涉及样式的情况下，页面元素是“从上往下”解析的，因此，与结构摆放顺序是有关系的。