Web前端面试指导(十六):为什么要初始化CSS样式?
题目点评
这个题目乍一看感觉怪怪的,什么叫初始化样式了?如果换一句话你可能就理解了,就是通用样式。这道题目主要涉及的是理论方面的知识,不用写代码,只要描述清楚就可以了
初始化样式的原因
因为浏览器的兼容的问题,不同浏览器有些标签的默认值是不同的,如果没有CSS初始化往往会出现浏览器之间的页面显示差异。
- <h1>标题1标签在不同浏览器的盒子模型</h1>
| 火狐浏览器 | 谷歌浏览器 |
| IE7浏览器 | IE9浏览器 |
从上面可以看出,同一个标签,不同的浏览器解析的数据是不一样的,这样就会导致显示的差异了。
弊端
初始化样式会对SEO有一定的影响,但鱼和熊掌不可兼得,但力求影响最小的情况下初始化。
淘宝初始化代码
- body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }
- body, button, input, select, textarea { font:12px/1.5tahoma, arial, \5b8b\4f53; }
- h1, h2, h3, h4, h5, h6{ font-size:100%; }
- address, cite, dfn, em, var { font-style:normal; }
- code, kbd, pre, samp { font-family:couriernew, courier, monospace; }
- small{ font-size:12px; }
- ul, ol { list-style:none; }
- a { text-decoration:none; }
- a:hover { text-decoration:underline; }
- sup { vertical-align:text-top; }
- sub{ vertical-align:text-bottom; }
- legend { color:#000; }
- fieldset, img { border:0; }
- button, input, select, textarea { font-size:100%; }
Web前端面试指导(十六):为什么要初始化CSS样式?的更多相关文章
- Web前端面试指导(十八):用纯CSS创建一个三角形的原理是什么?
题目点评 三角形的图标在网页设计是很常见的,属于基本常识题,只要在练习做到过这个功能都能回答出来,可以把你做过的思路描述出来就可以了,本题的难易程度为简单 答题要点 1.采用的是均分原理 盒子都是一个 ...
- Web前端面试指导(十):元素定位有哪些?
本题点评 在web前端中,元素定位是必须掌握的,是网页制作的必备技能,也是衡量是否为一个合格的web前端开发的标准之一,在网页设计中,很多地方都需要使用定位,例如菜单弹出,提示信息层等都需要定位.所以 ...
- Web前端面试指导(十九):CSS样式-如何清除元素浮动?
题目点评 本题属于比较常问的题目,也是在网页设计中经常遇到的问题,面试官希望通过这样的面试题来了解你对网页设计的基本功底,如果这样的题目答不出来,必会让面试官大失所望,面试成功的概率是非常小的. 答题 ...
- Web前端面试指导(十四):如何居中一个元素(正常、绝对定位、浮动元素)?
题目点评 这道题目的提问比较多,连续问了三个问题,正常元素.绝对定位元素.互动元素如何居中,而且居中没有说清楚是垂直居中还是水平居中,要回答清楚这个问题,必须得有深厚的功底,而且要分类的来回答,条理要 ...
- Web前端面试指导(十五):CSS样式-display有哪些作用?
题目点评 其实就是要你说清楚该属性有哪些值,每个值都有什么作用,这个题目可以答得很简单,但要答全也并非是一件容易的事情. 元素默认的display值的情况如下(这个一般很少人注意这一点) block( ...
- Web前端面试指导(十二):::before 和:before有什么区别?
题目点评 这个问题看来很简单,但如果之前没有琢磨这个问题,给人感觉也是门头一垂,听到这个题目就懵逼了,因为原来从来没有注意过这个问题,即便有注意这个问题也不能很好的回答清楚.回答的技巧就是从相同点和不 ...
- Web前端面试指导(二十):JavaScript中如何翻转一个字符串?
题目点评 字符串作在程序中是非常常见的,因为程序中绝大部分的数据都可以当作字符串来处理.需要对字符的处理方法比较熟悉,在回答的时候尽量能够说出多种解决方法更好! 字符串翻转的方法 1)使用字符串函数 ...
- Web前端面试指导(九):盒子模型你是怎么理解的?
问题分析 这道题问得比较宽泛,一定要找准切入点,如果切入点找不准,很容易乱答,甚至答偏,所以找准切入点是非常的重要的. 解答思路 1)盒子模型有两种,W3C和IE盒子模型 (1)W3C定义的盒子模型包 ...
- Web前端面试指导(八):iframe有那些缺点
本题的特点 这道题目的特点就是不按照正常的套路来提问,一般都是问优点,这里比较反常问iframe的缺点,很多同学肯定很不习惯这种问答,因为平时只关注有点,这么一问就懵逼了! 本题解答的思路及要点 ① ...
随机推荐
- php prepare
详见 https://stackoverflow.com/questions/134099/are-pdo-prepared-statements-sufficient-to-prevent-sql- ...
- 自适应大邻域搜索代码系列之(1) - 使用ALNS代码框架求解TSP问题
前言 上次出了邻域搜索的各种概念科普,尤其是LNS和ALNS的具体过程更是描述得一清二楚.不知道你萌都懂了吗?小编相信大家早就get到啦.不过有个别不愿意透露姓名的热心网友表示上次没有代码,遂不过瘾啊 ...
- 基于python复制蓝鲸作业平台
前言 去年看武sir代码发布的视频无意中听到了蓝鲸平台但是一直没深究,前一段时间公司要搞一个代码发布平台,但是需求变化很多一直找不到一个很好的参考 模板,直到试用了一下蓝鲸作业平台发现“一切皆作业”的 ...
- STM32-增量式旋转编码器测量
Development kit:MDK5.14 IDE:UV4 MCU:STM32F103C8T6 一.增量式旋转编码器 1.简介 编码器(encoder)是将信号(如比特流)或数据进行编制.转换为可 ...
- Java Web 热部署
热部署有多种方案,下面的方案是其中的一种. 暂时还没找到一种令人满意的方案. 1,配置WEB Server 去这里 (https://tomcat.apache.org/download-90.cgi ...
- Keras2.2 predict和fit_generator的区别
1.使用predict时,需设置batch_size 查看keras文档中,predict函数原型:predict(self, x, batch_size=32, verbose=0) 说明:只使用b ...
- jackson构建复杂Map的序列化
1.序列化复杂的Map时,可能需要下面的方式 import com.fasterxml.jackson.databind.JavaType; import com.fasterxml.jackson. ...
- Mac 10.12安装WebStorm
下载: (链接: https://pan.baidu.com/s/1c2o8wUG 密码: 2waz)
- IE8下不识别indexOf的问题
1.为Array原型添加indexOf方法(如果学过面向对象,相当于给Array类添加实例方法),方法体如下: //添加数组IndexOf方法 if (!Array.prototype.indexOf ...
- 3D效果
3D transform:rotate3d(x,y,z,a) (0.6,1,0.5,45deg) transform-origin 允许改变转换元素的位置,(中心点) transform-style ...