前端试题-CSS试题（1）

1. css属性命名区分大小写吗？

不区分，不过一般小写，便于理解

2. margin-top和margin-bottom对于行内（内敛inline）元素效果一样么？

3.padding-top和padding-bottom对于inline元素都会增加元素本身的大小么？

回答2，3，需要了解html里的替换元素和非替换元素。

替换元素是指作为其他内容点位符的一个元素。如img等。非替换元素是指内容包含在文档中的元素，例如span。

讨论margin-top和margin-bottom对行内元素是否起作用，则要对行内替换元素和行内非替换元素分别讨论。

把margin应用到行内元素是可以的，不过向非替换元素应用margin时，对行高没影响，而margin实际又是透明的，所以margin-top和margin-bottom没有任何视觉效果。把margin-left和margin-right应用到非替换元素是有影响的。

为行内替换元素设置margin-top和margin-bottom，可能会使行高增加或减少，这取决于margin-top和margin-bottom的值。margin-left和margin-right对行内替换元素和非替换元素一样也是有影响的。

对于行内元素，设置padding-left和padding-right是可见有影响的，设置padding-top和padding-bottom后，对于行内非替换元素，padding-top和padding-bottom没用，不会影响其行高，不会撑开父元素。而对于行内替换元素，padding-top和padding-bottom会撑开父元素。

inline元素(准确来说是非替换的行内元素)不能设置竖直方向上的margin和padding，这个是css标准所规定的。

总之，inline元素，宽高无效，margin,padding只有左右边距有效，上下无效。

4. 如果一个p 标签拥有font-size: 10rem，那么这个p标签会自动响应窗口布局吗？

不会，rem是以html根元素font-size的大小为基准的相对度量单位，文本的大小不会随着窗口的大小改变而改变。一般默认根元素font-size为16px，不过可以改变它的值。

5. 伪类选择器：checked对于option标签有效果吗？

有。

伪类选择器：checked会作用于radio(<input type=”radio”>), checkbox(<input type=”checkbox”>)或者 option元素(<option> in a <select>)。

6. 伪类：root 通常指的是标签<html>?

不是。

单指创建的根。这个根可能不是 html ，如果是片段html，木有创建根，则为片段的根。如呂康豪大大所说的一样。https://www.zhihu.com/question/20312140

7. translate()方法可不可以使元素在z轴上做变换？

不能。

translate()方法包含在CSS3的2D transform函数里。它可以在x轴和y轴上移动位置。

转载于:https://www.cnblogs.com/sunshinegirl-7/p/5253560.html

前端试题-CSS试题（1）相关推荐

前端基础面试题(HTML + CSS)
前端基础面试题(HTML + CSS) 1.行内元素和块级元素?img算什么?行内元素怎么转化为块级元素? 行内元素:和有他元素都在一行上,高度.行高及外边距和内边距都不可改变,文字图片的宽度不可改变 ...
前端HTML+CSS面试题汇总一
目录你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? Quirks模式是什么?它和Standards模式有什么区别 Doctype作用? 严格模式与混杂模式-如何触发这两种模式,区分它们有 ...
百度糯米android面试题,前端面试—CSS面试题汇总
前端面试-CSS面试题汇总博客说明文章所涉及的资料来自互联网整理和个人总结,意在于个人学习和经验汇总,如有什么地方侵权,请联系本人删除,谢谢! 1.flex常见面试题 Flex 是 Flexible ...
BAT及各大互联网公司2014前端笔试面试题：HTML/CSS/JAVASCRIPT
BAT及各大互联网公司2014前端笔试面试题:HTML/CSS/JAVASCRIPT Html篇: 1.你做的页面在哪些流览器测试过?这些浏览器的内核分别是什么? IE: trident内核 Fire ...
前端笔试题面试题记录（上）
前言过完元宵,就到上海找了波工作,现在已经入职好了,蹭波热点,写一波面试记录,内容包含笔试题和面试题,还有一些没有写进来,准备再开一篇,许久没写了,写的确实有些慢.如果喜欢的话可以点波赞,或者关注一 ...
Web前端经典面试试题（二）
上次由于时间有限只分享了一部分的前端面试题,所以本篇继续分享前端经典面试试题一. 栈和队列的区别? 栈的插入和删除操作都是在一端进行的,而队列的操作却是在两端进行的. 队列先进先出,栈先进后出. 栈 ...
前端开发面试题总结之——JAVASCRIPT（一）
___________________________________________________________________________________ 相关知识点数据类型.运算.对象 ...
Web前端JQuery面试题（三）
Web前端JQuery面试题(三) 1.怎么阻止冒泡过程? stopPropagation(); // 阻止冒泡过程 2.ready()方法和onload()方法的区别? onload()方法要等页面 ...
js考试题 html5新特性,Web前端初级面试题总结
Web前端初级面试题总结发布时间:2018-11-02 11:17, 浏览次数:549 , 标签: Web Web篇: 1.常见的浏览器内核有哪些? IE:Trident内核 ...

前端试题-CSS试题（1）

前端试题-CSS试题（1）相关推荐

最新文章

热门文章