前端一阶段易错题集合

目录

1.在HTML中使用link标签链接的样式表是

3.能实现背景平铺效果,对应的CSS为

4.关于样式表的优先级说法正确的是

5.以下css属性设置语法正确的有

6.下列哪些标准是由W3C(万维网联盟)制定的

7.选出你认为最合理的定义标题的方法

9.下列属于input标签的属性有

10.下列属于a标签的属性有

11.下列哪些标签能够实现加粗效果

12..如果想跳转到同一目录下的名为res.html文件的名为show的锚点,下列(   A )写法是正确的?

13.用HTML+CSS开发商业网站测试分析,在制作网页时,关于overflow属性说法错误的是( B  )

14.给strong标签设置以下哪些css属性,可以在浏览器中能正常显示?(strong是内联元素)

15.行内元素的特征有哪些

16.overflow属性的属性值有哪些

17.以下哪个标签是属于table表格的行分组的标签?

18.可以解决图片底部间隙的问题的方法正确的是

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

20.CSS哪些属性没有继承性(  D )

21.如何让元素高度自适应?(父元素的高度由内容撑开)

22.以下哪些属性,可以让元素不论本身是什么元素类型,设置之后都会产生块级框(块级框就是元素可以设置宽高)

23.给strong标签设置以下哪些css属性,可以在浏览器中能正常显示?(strong是内联元素)

24.position定位属性设置哪些属性值,添加z-index属性会有效

25.盒子内的文本溢出盒子范围,以下选项中可以隐藏溢出文本且不产生滚动条的选项是?

26.不属于vertical-align的属性值

27.层级选择器相邻兄弟选择器的写法是

28.属于H5新增的表单属性的是

29.下面关于transition-delay的说法不正确的是

30.下面关于渐变的说法不正确的是

31.以下选项中书写正确的是

32.以下哪些方法能解决img把父元素高度撑大3~6像素的问题

33.以下对background-size属性值描述正确的是

34.h5新增的表单属性有哪些

35.以下对order属性描述正确的是

36.以下哪些条件可以触发BFC 

37.3D动画中,元素沿着X、Z轴旋转90deg的方法

38.以下设置不正确的有

39.以下设置背景图片不会发生变形的有

40.关于盒模型的描述,正确的是

41..css3背景属性background-size的哪个值既不会被裁切也不会变形

42.以下属于表格行分组的是 

43.当子元素的margin-top传递到父元素上时,以下哪个属性可以解决

44.以下选项中的伪元素选择符有

---

1.在HTML中使用link标签链接的样式表是

A 行内样式                                                                              B内部样式

C外部样式                                                                               D导入样式

解析:

css有三种样式表： 分别为： 内部样式表 外部样式表的连接方法 内嵌/行间样式表

2.在HTML中引入css内部样式表使用
A  style           B  p              C  link           D  strong

解析:

内部样式表的语法

3.能实现背景平铺效果,对应的CSS为

A div{background-image:url(images/bg.gif);}

B div{background-image:url(images/bg.gif) repeat-x;}

C div{background-repeat:url(images/bg.gif) repeat-y;}

D div{backgroud-repeat:url(images/bg.gif) no-repeat;}

解析:

background-image属性后面只能添加图片路径的属性值，因为他不是复合式写法，不能同时添加平铺属性值。当只添加背景图时，背景图默认平铺。

4.关于样式表的优先级说法正确的是

A 直接定义在标记上的css样式级别最高

B 内部样式表次之

C 外部样式表级别最低

D同一个选择器中,设置样式时,设置相同的属性,后设的属性值起作用

5.以下css属性设置语法正确的有

A text-indent:-999px;

B margin-left:-10px;

C padding-left:-10px;

D width:100%;

解析:

text-indent,margin的属性允许属性值为负数，padding的属性值不可以为负数，width可以写百分比

6.下列哪些标准是由W3C(万维网联盟)制定的

A html      B css          C xhtml        D javascript

7.选出你认为最合理的定义标题的方法

A  文章标题

B  

文章标题

C  

文章标题

D  文章标题

解析:h1-h6文本标题标签

9.下列属于input标签的属性有

A name         B selected           C rows            D value

10.下列属于a标签的属性有

A title       B target        C src         D href

11.以下代码

其中css中定义如下 .a{width: 200px;height: 200px;background-color: #f00;float: left;} .b{width: 300px;height: 300px;background-color: #ff0;} 以下说法正确的是()

A 两个盒子会发生重叠

B 元素a在元素b上方

C 元素b在元素a上方

D 两个元素将左右排列

解析:

float:left原理    添加float:left的元素会把右侧的空间做“预留”，等待下个添加浮动的元素的站位

11.下列哪些标签能够实现加粗效果

A b标签      B strong标签      C h标签         D i标签

12..如果想跳转到同一目录下的名为res.html文件的名为show的锚点,下列(   A )写法是正确的?

A  跳转

B  跳转

C  跳转

D  跳转

解析:

锚点语法<标签  id="">    

13.用HTML+CSS开发商业网站测试分析,在制作网页时,关于overflow属性说法错误的是( B  )

A  overflow属性的常见值有visible、hidden、scroll、auto

B  当属性值为hidden时,如果内容被修剪,则浏览器会显示滚动条以便查看其余内容

C  可以使用overflow属性与盒子宽度配合使用,清除浮动来扩展盒子的高度

D  如果页面中有绝对定位元素,并且绝对定位的元素超出了父级的范围,使用overflow属性则不合适

解析:

overflow：hidden;是溢出隐藏不会有滚动条

14.给strong标签设置以下哪些css属性,可以在浏览器中能正常显示?(strong是内联元素)

A margin:100px auto;

B padding:20px 30px;

C margin-left:40px;margin-right:40px;

D  padding-left:40px;padding-right:40px;

解析:

margin和padding对于行内元素span这类的标签垂直方向设置不会影响位置

15.行内元素的特征有哪些

A  此元素可以和其他行内元素在一行内逐个显示

B  可以设置宽度和高度

C  此元素的宽度和高度跟据内容而定

D  可以使用盒模型中的margin,padding属性,但是垂直方向的显示不正常

16.overflow属性的属性值有哪些

A hidden      B visible      C scroll        D auto

17.以下哪个标签是属于table表格的行分组的标签?

A tfoot     B col      C caption      D colgroup

解析:

表格行分组是thead  tbody tfoot所以选择A；col和colgroup是列分组，caption是表格标题

18.可以解决图片底部间隙的问题的方法正确的是

A display:inline-block

B margin:0;

C padding:0;

D display:block;

解析:

题目问的是图片撑大3像素的兼容问题，解决方法有2个，1是给img设置display：block；或者vertical-align：top;。

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

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

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

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

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

解析:

absolute 生成绝对定位的元素，相对于 static 定位以外的第一个父元素进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 fixed 生成绝对定位的元素，相对于浏览器窗口进行定位。 元素的位置通过 "left", "top", "right" 以及 "bottom" 属性进行规定。 relative 生成相对定位的元素，相对于其正常位置进行定位。 因此，"left:20" 会向元素的 LEFT 位置添加 20 像素。 static 默认值。没有定位，元素出现在正常的流中（忽略 top, bottom, left, right 或者 z-index 声明）。

20.CSS哪些属性没有继承性(  D )

A font-size      B font-family      C color       D height

解析:

CSS 继承是指我们设置上级(父级)的CSS样式，上级（父级）及以下的子级（下级）都具有此属性，一般只有文字文本具有继承特性，如文字大小、文字加粗、文字颜色、字体等。

21.如何让元素高度自适应?(父元素的高度由内容撑开)

A  给元素设置height:100%

B  给元素设置height:auto

C  高度不写

D  给元素设置height:content;

解析:

height:auto或者高度不写，父元素的高度由内容撑开

22.以下哪些属性,可以让元素不论本身是什么元素类型,设置之后都会产生块级框(块级框就是元素可以设置宽高)

A display:block

B position:fixed

C float:left

D position:absolute

解析:

例如span默认不可以设置宽高，一旦浮动或者使用绝对定位和固定定位，就可以设置了

23.给strong标签设置以下哪些css属性,可以在浏览器中能正常显示?(strong是内联元素)

A margin:100px auto;

B padding:20px 30px;

C  margin-left:40px;margin-right:40px;

D padding-left:40px;padding-right:40px;

解析:

margin和padding对于行内元素span这类的标签垂直方向设置不会影响位置

24.position定位属性设置哪些属性值,添加z-index属性会有效

A static     B absolute     C relative       D fixed

解析:

z-index必须结合position属性才生效

25.盒子内的文本溢出盒子范围,以下选项中可以隐藏溢出文本且不产生滚动条的选项是?

A overflow:auto;

B overflow-xy:hidden;

C overflow-x:hidden;overflow-y:hidden;

D overflow:hidden;

解析:

overflow:hidden是隐藏，overflow-x:hidden;针对x轴，overflow-y:hidden;针对y轴

26.不属于vertical-align的属性值

A middle     B center      C top     D bottom

27.层级选择器相邻兄弟选择器的写法是

A E  B E+F        C E>F      D E~F

28.属于H5新增的表单属性的是

A value       B checked     C placeholder      D selected

29.下面关于transition-delay的说法不正确的是

A transition-delay如果是0,那么可以省略不写

B transition-delay必须写在过渡的最后

C transition-delay是过渡的执行时间

D transition-delay是过渡的等待时间

30.下面关于渐变的说法不正确的是

A 渐变的颜色最多不能超过5种

B 线性渐变和径向渐变可以同时使用

C 渐变中的色标位置可调

D 渐变同样支持过渡

31.以下选项中书写正确的是

A  background-image:-webkit-linear-gradient(to top,red,yellow)

B  webkit-background-image:linear-gradient(to top,red,yellow)

C  background-image:-mos-linear-gradient(to top,red,yellow)

D  mos-background-image:linear-gradient(to top,red,yellow)

32.以下哪些方法能解决img把父元素高度撑大3~6像素的问题

A font-size:0

B html代码不换行

C vertical-align:top

D float:left

33.以下对background-size属性值描述正确的是

A background-size:cover;  背景图会超出容器,背景不会发生变形

B background-size:contain;  背景图会超出容器,背景不会发生变形

C background-size:100% 100%;  背景图会发生变形,背景图不会超出容器

D background-size:100%;  背景图不会超出容器,不会变形

34.h5新增的表单属性有哪些

A required      B checked      C pattern       D placeholder

35.以下对order属性描述正确的是

A  数值越小,排列越靠前

B  数值越大,排列越靠前

C  order可以改变HTML结构顺序

D  以上描述都不正确

36.以下哪些条件可以触发BFC 

A 将元素转换成display:inline-block或table-cell

B 设置元素的position属性,任何属性值都可以

C 设置元素的overflow属性,任何属性值都可以

D 元素设置宽度高度及边框就可以

37.3D动画中,元素沿着X、Z轴旋转90deg的方法

A transform: scale3d(0,1,0,90deg);

B transform: scale3d(1,0,1,90deg);

C transform: rotate3d(0,1,0,90deg);

D transform: rotate3d(1,0,1,90deg);

38.以下设置不正确的有

A padding:-10px;

B margin-top:-10px;

C z-index:-1;

D text-shadow:5px -5px -5px gray;

39.阅读下面HTML代码,若要使

和

标签在同一行显示,下面选项中的CSS书写正确的是( C ).

        

用户名:

        

      

A dl dt { float:left;｝

B dl dd { float:left;｝

C dl dt, dl dd { float:left;｝

D dl { display:inline;｝

39.以下设置背景图片不会发生变形的有

A background-size:100% 100%;

B background-size:cover;

C background-size:100%;

D background-size:contain;

40.关于盒模型的描述,正确的是

A 标准盒模型的总宽度=width+左右padding+左右border+左右margin

B 标准盒模型的总宽度=width+左右margin

C 怪异盒模型的总宽度=width+左右padding+左右border

D 怪异盒模型的总高度=height+上下margin

41..css3背景属性background-size的哪个值既不会被裁切也不会变形

A cover     B contain     C 100% auto       D 100% 100%

42.以下代码

其中css中定义如下 .a{width: 200px;height: 200px;background-color: #f00;float: left;} .b{width: 300px;height: 300px;background-color: #ff0;overflow: hidden;}  

A 两个盒子会发生重叠

B 元素a在元素b上方

C 两个元素不会重叠

D 两个元素将左右排列

42.以下属于表格行分组的是 

A colgroup       B thead        C tbody        D tfoot

43.当子元素的margin-top传递到父元素上时,以下哪个属性可以解决

A font-size:0        B float:left        C overflow:hidden

44.以下选项中的伪元素选择符有

A :active     B ::after      C :visited       D ::before

备注： 图片插入容器会自带3-5间距的解决方法：

1.img的css中以下三选一

display:block;

vertical-align:top;

vertical-align:bottom;

2.图片外层DIV的CSS添加

font-size:0;