前端—每天5道面试题（十一）
前端—每天5道面试题（十一）
每天进步1% 不多 就1%
一、简述对 Web 语义化的理解？
就是让浏览器更好的读懂你写的代码，在进行 HTML 结构、表现、行为设计时，尽量使用语义化的标签，使程序代码简介明了，易于进行 Web 操作和网站 SEO，方便团队协作的一种标准，以图实现一种“无障碍”的 Web 开发。
二、合理的页面布局中常听过结构与表现分离，那么结构是什么？表现是什么？
结构是 html，表现是 css
三、你能描述一下渐进增强和优雅降级之间的不同吗？
- 渐进增强 progressive enhancement：针对低版本浏览器进行构建页面，保证最基本的功能，然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验。
- 优雅降级 graceful degradation：一开始就构建完整的功能，然后再针对低版本浏览器进行兼容。
- 区别：优雅降级是从复杂的现状开始，并试图减少用户体验的供给，而渐进增强则是从一个非常基础的，能够起作用的版本开始，并不断扩充，以适应未来环境的需要。降级（功能衰减）意味着往回看；而渐进增强则意味着朝前看，同时保证其根基处于安全地带，举个例子：
a{display： block；
width： 200px；
height： 100px；
background：aquamarine；
/*我就是要用这个新 css 属性*/
transition： all 1s ease 0s；
/*可是发现了一些低版本浏览器不支持怎么吧*/
/*往下兼容*/
-webkit-transition：all 1s ease 0s；
-moz-transition：all 1s ease 0s；
-o-transition： all 1s ease 0s；
/*那么通常这样考虑的和这样的侧重点出发的 css 就是优雅降级*/
}
a：hover{height： 200px；
}
/ *那如果我们的产品要求我们要重低版本的浏览器兼容开始*/
a{/*优先考虑低版本的*/
-webkit-transition：all 1s ease 0s；
-moz-transition：all 1s ease 0s；
-o-transition： all 1s ease 0s；
/*高版本的就肯定是渐进渐强*/
transition： all 1s ease 0s；
}
“优雅降级”观点认为应该针对那些最高级、最完善的浏览器来设计网站。
“渐进增强”观点则认为应关注于内容本身。
四、display： none；与 visibility： hidden 的区别是什么？
- display：none； 使用该属性后，HTML 元素（对象）的宽度、高度等各种属性值都将 “丢失”；
- visibility：hidden； 使用该属性后，HTML 元素（对象）仅仅是在视觉上看不见（完全透明），而它所占据的空间位置仍然存在，也即是说它仍具有高度、宽度等属性值。
五、Doctype 作用? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义?
DOCTYPE 是一种标准通用标记语言的文档类型声明，它的目的是要告诉标准通用标记语言解析器，它应该使用什么样的文档类型定义来解析文档。只有确定了一个正确的文档类型，超文本标记语言或可扩展超文本标记语言中的标签和层叠样式表才能生效，甚至对 javascript 脚本都会有所影响。
标准模式是指浏览器按 W3C 标准解析执行代码
怪异模式则是使用浏览器自己的方式解析执行代码，因为不同浏览器解析执行的方式不一样，所以我们称之为怪异模式。
浏览器解析时到底使用标准模式还是怪异模式，与你网页中的 DTD 声明直接相关，DTD 声明定义了标准文档的类型（标准模式解析）文档类型，会使浏览器使用相应的方式加载网页并显示，忽略 DTD 声明,将使网页进入怪异模式(quirks mode)
区分它们的意义：doctype 声明指出阅读程序应该用什么规则集来解释文档中的标记
如何触发两种模式？
DOCTYPE 不存在或形式不正确会导致 HTML 和 XHTML 文档以混杂模式呈现
触发严格模式
<!-- HTML 4.01 严格型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!-- XHTML 1.0 严格型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
触发混杂模式
<!-- HTML 4.01 过渡型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<!-- HTML 4.01 框架集型 -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
"http://www.w3.org/TR/html4/frameset.dtd">
<!-- XHTML 1.0 过渡型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!-- XHTML 1.0 框架集型 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
前端—每天5道面试题（十一）相关推荐
- 前端—每天5道面试题（十三）
前端-每天5道面试题(十三) 一.display:none:和visibilty:hidden ;和opacity:0:和overflow:hidden的区别? display:none:隐藏自己,隐 ...
- 前端—每天5道面试题（十二）
前端-每天5道面试题(十二) 每天进步1% 不多 就1% 一.CSS3 新特性有哪些 1.颜色:新增 RGBA,HSLA 模式 2. 文字阴影(text-shadow.) 3.边框: 圆角(borde ...
- 前端—每天5道面试题（十）
前端-每天5道面试题(十) 每天进步1% 不多 就1% 一.用 div+css 布局的好处? 表现和内容相分离 将设计部分剥离出来放在一个独立样式文件中,HTML 文件中只存放文本信息. 提高搜索引擎 ...
- 前端—每天5道面试题（九）
前端-每天5道面试题(九) 每天进步1% 不多 就1% 一.overflow 有哪些属性值? Visible:默认值,内容不会被修剪,会呈现在元素框之外. Hidden:内容会被修剪,并且其余内容是不 ...
- 前端—每天5道面试题（8）
前端-每天5道面试题(8) 每天背5道前端面试题,你会越来越优秀 1.console.log 是同步还是异步? 如何实现 一个 console.log? console.log 内部实现的是 proc ...
- 前端—每天5道面试题（7）
前端-每天5道面试题(7) 每天背5道前端面试题,你会越来越优秀 1.webpack 中 loader 和 plugin 的区别是什么? loader:loader 是一个转换器,将 A 文件进行编译 ...
- 前端—每天5道面试题（6）
前端-每天5道面试题(6) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.谈谈JS 异步解决方案的发展历程以及优缺点. 1.回调函数(callback) 优点:解决了同步的问题(只要有一个任 ...
- 前端—每天5道面试题（5）
前端-每天5道面试题(5) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.简述一下前端的性能优化问题 (一).页面内容方面 通过文件合并.css 雪碧图.使用 base64 等方式来减少 H ...
- 前端—每天5道面试题（4）
前端-每天5道面试题(4) 每天背5道前端面试题,希望我可以在远方的终点见到你 1.写 React / Vue 项目时为什么要在列表组件中写 key, 其作用是什么? key 是给每一个 vnode ...
最新文章
- 针对 Windows Phone 7 上的独立存储的 Sterling
- mysql druid 多数据源_SpringBoot使用阿里数据库连接池Druid以及多数据源配置
- 网络营销外包专员浅析网络营销外包如何防止发布的外链被删除呢？
- 程序员的自我修养——远离“外包思维”
- 在XIB里面关于@property,@synthesize,release,dealloc的怪现象
- sqlalchemy入门记录
- VMware-NAT连接网络
- 【Mark】转正述职答辩
- 密码学0930大作业
- netcat常用命令
- 软件构造 Lab3 CircularOrbit 实验日记
- 在Elasticsearch使用URI花式搜索
- Lightroom无法在卷计算机上,lightroom无法正常启动怎么办？解决lightroom无法启动方法...
- 逻辑回归(吴恩达机器学习笔记)
- 【androidstudio】悬浮按钮，悬浮在右侧中间
- 堆和栈的区别 (BY 任我行)
- 杂谈——常用的浏览器请求头User - Agent大全
- 正版cs跳跃服务器,CS1.6Kz跳跃服务器IP集合(08.3.1更新)
- python 神经网络包_Python(neurolab搭建神经网络)
- （附源码）小程序 宠物健康管理系统 毕业设计 201738