HTML+CSS 测试题部分 150

1.点击事件

在这里插入图片描述

2.框架

语法< frame noresize=“noresize”>

定义和用法
noresize 属性规定用户无法调整框架的大小。
默认地，可以通过拖动框架之间的“墙壁”来改变框架的大小，该属性可以锁定框架的大小。
在这里插入图片描述

3.color-hex

color-hex
#ff0000 color RGB value is (255,0,0). This hex color code is also a web safe color which is equal to #F00. #ff0000 color name is Red1 color.

在这里插入图片描述

4.将列表的list-style-type属性设置为square，实现实心矩形

将列表的list-style-type属性设置为square，实现实心矩形
在css中，可以将列表的list-style-type属性设置为square，实现实心矩形。下面举例讲解CSS如何能够定义列表的项目符号为实心矩形。
在这里插入图片描述

5.图片整合技术

css图片整合技术的概念及优缺点（雪碧图，精灵图，滑动门技术）
一、图片整合的概念
将多张图整合到一张背景图中，使用background-position 来实现图片的定位的技术叫图片整合技术，也称雪碧图，精灵图，滑动门技术。
二、优势
1.将多张图整合到一张图中，减少了对服务器的请求，加快了图片的加载速度，从而达到了网站性能的优化；
2.减小了图片的体积。
当页面加载时，不是加载每个单独图片，而是一次加载整个组合图片。这是一个了不起的改进，它大大减少了HTTP请求的次数，减轻服务器压力，同时缩短了悬停加载图片所需要的时间延迟，使效果更流畅，不会停顿。）
三、缺点
在拼图时，比较麻烦，还有后期维护也比较麻烦，比如做好的图，然后一个图标改了大小，但是图标之间留的位置不够，那你就要重写很多css，当然现在已经很多这方面的软件，或者在线生成代码。。。但这个麻烦还是存在的。
在这里插入图片描述

6.display

在这里插入图片描述

7.div 添加滚动条

div 添加滚动条

只设置水平滚动条：
<div style="width:100px;overflow-x:auto"></div>
只设置垂直滚动条：
<div style="height:300px;overflow-y:auto"></div>
水平与垂直都设置：
<div style="width:70px;height:300px;overflow-x:auto;overflow-y:auto"></div>
1
2
3
4
5
6

在这里插入图片描述

8. 浮动塌陷的解决

浮动塌陷
概念：当一个(没有设置高度的)元素中所有的子元素都进行了浮动，此时，该元素的高
度会塌陷为0
解决：
1.直接设置高度;
2.设置overflow属性 hidden/auto；
3.在父元素中在加一个空的div 设置clear:both; 了解
4.通过元素的after伪类设置清除浮动属性。

下题应该选c
在这里插入图片描述

9.盒子之间的关系 3种水平垂直重叠

在这里插入图片描述
参考25：关系：水平、垂直、重叠

10.position

在这里插入图片描述

在这里插入图片描述

上下最大？左右相加？

在这里插入图片描述

在这里插入图片描述

XHTML严格？

在这里插入图片描述

在这里插入图片描述

垂直：最大值水平：相加

在这里插入图片描述

什么是包含块，对于包含块的理解？

包含块：包含块(containing block)就是元素用来计算和定位的一个框。
1、根元素(很多场景下可以看成)被称为‘初始包含块’,其尺寸等同于浏览器可视窗口的大小。
2、对于其他元素，如果该元素的position是relative或者static，则包含块由其最近的块级祖先元素content box边界形成。
3、如果元素的position:fixed，则‘包含块’是初始包含块。
4、如果元素position：absolute,则包含块由最近的position不为static的祖先元素建立。
5、简单总结:
默认情况下包含块就是离当前元素最近的块级祖先元素。对于开启绝对定位的元素来说，包含块是离它最近的开启了定位(且position不为static)的祖先元素。如果所有的祖先元素都没有开启定位，则其包含块就是初始包含块。

在这里插入图片描述