Html&css刷题知识记录

2017-09-13 20:45:20来源:CSDN作者:qq_33858965人点击

分享

为了打好基础,就去牛客刷题了….
发现很多题还是考的很细的,平时没有注意到的题考了我一脸懵逼,所以记录一下那些不熟悉的,不知道的,弄混的,记错的题目即解析,回头再回来复习~


1.在使用table表现数据时,有时候表现出来的会比自己实际设置的宽度要宽,为此需要设置下面哪些属性值?


2.下面哪些是HTML5 新增的表单元素?

datalist 元素规定输入域的选项列表。
keygen 元素的作用是提供一种验证用户的可靠方法。keygen 元素是密钥对生成器(key-pair generator)。当提交表单时,会生成两个键,一个是私钥,一个公钥。(目前支持性很差)
output 元素用于不同类型的输出
3.iframe的使用场景有?

iframe可用在以下几个场景中:
1:典型系统结构,左侧是功能树,右侧就是一些常见的table或者表单之类的。为了每一个功能,单独分离出来,采用iframe。
2:ajax上传文件。
3:加载别的网站内容,例如google广告,网站流量分析。
4: 在上传图片时,不用flash实现无刷新。
5: 跨域访问的时候可以用到iframe,使用iframe请求不同域名下的资源。

4.可继承的样式属性包括()

css中,边框,盒子模型,背景属性属于不可继承属性 字体,文本样式属性属于可继承属性

不可继承的:display、margin、border、padding、background、height、min-height、max- height、width、min-width、max-width、overflow、position、left、right、top、 bottom、z-index、float、clear、table-layout、vertical-align、page-break-after、 page-bread-before和unicode-bidi。

所有元素可继承:visibility和cursor。

内联元素可继承:letter-spacing、word-spacing、white-space、line-height、color、font、 font-family、font-size、font-style、font-variant、font-weight、text- decoration、text-transform、direction。

块状元素可继承:text-indent和text-align。

列表元素可继承:list-style、list-style-type、list-style-position、list-style-image。

表格元素可继承:border-collapse。
5.

AB visiblity:看不见,摸的着. display:看不见,摸不着. display是dom级别的,可以渲染和重绘。 visiblity不是dom级别的,不能重绘,只能渲染

6.关于栅格系统,以下说法正确的是
会有自动的padding样式
会有自动的margin样式
其字体默认为14px
其box-sizing默认为border-box

栅格系统有自动的padding,无自动margin,默认字体14px,box-sizing默认为border-box

7.下列关于比较Ajax与Flash的优缺点,相关描述正确的是?
Ajax的优势在意在于开放性,易用性及易于开发
Flash的优势在于多媒体处理,可以更容易的调用浏览器以外的外部资源
Ajax最主要的批评就是它可能破坏浏览器的后退功能
flash 文件经常会很大,用户第一次使用的时候需要忍耐较长的等待时间
正确答案: A B C D
1.Ajax的优势:1.可搜索性 2.开放性 3.费用 4.易用性 5.易于开发。
2.Flash的优势:1.多媒体处理 2.兼容性 3.矢量图形 4.客户端资源调度
3.Ajax的劣势:1.它可能破坏浏览器的后退功能 2.使用动态页面更新使得用户难于将某个特定的状态保存到收藏夹中 ,不过这些都有相关方法解决。
4.Flash的劣势:1.二进制格式 2.格式私有 3.flash 文件经常会很大,用户第一次使用的时候需要忍耐较长的等待时间 4.性能问题

8.请选出用于标题的标签

MDZZ…只有h1到h6

9.下面有关HTML的Doctype和严格模式与混杂模式的描述,错误的是?
声明位于文档中的最前面,处于 标签之前。告知浏览器的解析器,用什么文档类型 规范来解析这个文档
在标准模式中,浏览器根据规范呈现页面;在混杂模式中,页面以一种比较宽松的向后兼容的方式显示
DOCTYPE不存在或格式不正确会导致文档以标准模式呈现
浏览器根据DOCTYPE是否存在以及使用的哪种DTD来选择要使用的呈现方法

文档类型
DTD(文档类型定义)是一组机器可读的规则,他们定义 XML 或 HTML 的特定版本中允许有什么,不允许有什么。在解析网页时,浏览器将使用这些规则检查页面的有效性并且采取相应的措施。浏览器通过分析页面的 DOCTYPE 声明来了解要使用哪个 DTD ,由此知道要使用 HTML 的哪个版本。
DOCTYPE 当前有两种风格,严格( strict )和过渡( transitional )。过渡 DOCTYPE 的目的是帮助开发人员从老版本迁移到新版本。
如果发送具有正确的 MIME 类型的 XHTML 文档,理解 XML 的浏览器将不显示无效的页面。
浏览器模式
浏览器有两种呈现模式:标准模式和混杂模式(quirks mode)。在标准模式中,浏览器根据规范呈现页面;在混杂模式中,页面以一种比较宽松的向后兼容的方式显示。
DOCTYPE 切换
对于 HTML 4.01 文档,
包含严格 DTD 的 DOCTYPE 常常导致页面以标准模式呈现。
包含过度 DTD 和 URI 的 DOCTYPE 也导致页面以标准模式呈现。
但是有过度 DTD 而没有 URI 会导致页面以混杂模式呈现。
DOCTYPE 不存在或形式不正确会导致 HTML 和 XHTML 文档以混杂模式呈现。

10.关于下列CSS选择器:ID选择器、类选择器、伪类选择器、标签名称选择器,排序正确的是:()

11.当margin-top、padding-top的值是百分比时,分别是如何计算的?

可以对元素的margin设置百分数,百分数是相对于父元素的width计算,不管是margin-top/margin-bottom还是margin-left/margin-right。(padding同理)

如果没有为元素声明width,在这种情况下,元素框的总宽度包括外边距取决于父元素的width,这样可能得到“流式”页面,即元素的外边距会扩大或缩小以适应父元素的实际大小。如果对这个文档设置样式,使其元素使用百分数外边距,当用户修改浏览窗口的宽度时,外边距会随之扩大或缩小。

为什么margin-top/margin-bottom的百分数也是相对于width而不是height呢?

CSS权威指南中的解释:

我们认为,正常流中的大多数元素都会足够高以包含其后代元素(包括外边距),如果一个元素的上下外边距时父元素的height的百分数,就可能导致一个无限循环,父元素的height会增加,以适应后代元素上下外边距的增加,而相应的,上下外边距因为父元素height的增加也会增加,如果循环。
12.
13.
这个题……很坑,还好看的仔细
首先span不是块级元素,是不支持宽高的,但是style中有了个float:left;就使得span变成了块级元素支持宽高,height:100%;即为,200,宽度由内容撑开。
但是内容中的 i 是绝对定位,脱离了文档流,所以不占父级空间,所以span的width=0
14.

置换元素的意思是 展现不是由CSS来控制的元素。这些外部元素的展现不依赖于CSS规范
15.

答案是4444
每个li标签的onclick事件执行时,本身onclick绑定的function的作用域中没有变量i,i为undefined,则解析引擎会寻找父级作用域,发现父级作用域中有i,且for循环绑定事件结束后,i已经赋值为4,所以每个li标签的onclick事件执行时,alert的都是父作用域中的i,也就是4。这是作用域的问题。

16.


17.
1.常见的块级元素(自动换行, 可设置高宽 )有:
div,h1-h6,p,pre,ul,ol,li,form,table,label等
2。常见的行内元素(无法自动换行,无法设置宽高)有:
a,img,span,i(斜体),em(强调),sub(下标),sup(上标)等。
3.常见的行块级元素(拥有内在尺寸,可设置高宽,不会自动换行 )有:
(button,input,textarea,select), img等
4.label元素不会是浏览器默认的行块级元素, 实践出真知
input默认情况下可以设置可设置高宽,不会自动换行。但是label并没有变化(为了看的更加明显,所以给label加了边框)。
手动设置label的display属性为inline-block,才能实现可设置高宽,不会自动换行的效果。

18.

19.下面有关CSS中link和@import的区别,描述错误的是?

20.下列哪个操作是W3C标准定义的阻止事件向父容器传递:

DOM中的事件对象:(符合W3C标准)
preventDefault() 取消事件默认行为
stopImmediatePropagation() 取消事件冒泡同时阻止当前节点上的事件处理程序被调用。
stopPropagation() 取消事件冒泡对当前节点无影响。
IE中的事件对象:
cancelBubble() 取消事件冒泡
returnValue() 取消事件默认行为

21.css属性overflow属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。

参数是scroll时候,必会出现滚动条。
参数是auto时候,子元素内容大于父元素时出现滚动条。
参数是visible时候,溢出的内容出现在父元素之外。
参数是hidden时候,溢出隐藏。

22.


23.

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台