前端兼容

2017年-Web前端面试题(HTML至Nodejs)

筅森魡賤 提交于 2019-12-23 00:06:47
【原】2017年-Web前端面试题(HTML → Nodejs) 出自作者小矮人Web前端,博文地址: http://www.cnblogs.com/itlkNote/ 文中有少许重复问题! 第一阶段 HTML、CSS、HTML5、CSS3 1、XHTML与HTML的有何异同? 2、介绍一下CSS的盒子模型?弹性盒子模型是什么? 3、Doctype的作用?标准模式与兼容模式各有什么区别? 4、HTML5 为什么只需要写 <!DOCTYPE HTML>? 5、行内元素有哪些?块级元素有哪些? 空(void)元素有那些? 6、页面导入样式时,使用link和@import有什么区别? 7、介绍一下你对浏览器内核的理解? 8、常见的浏览器内核有哪些? 9、HTML5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5? 10、简述一下你对HTML语义化的理解? 11、iframe有那些缺点? 12、列出display的值,说明他们的作用?position的值, relative和absolute定位原点是? 13、一个满屏 品 字布局 如何设计? 14、常见兼容性问题? 15、如果需要手动写动画,你认为最小时间间隔是多久,为什么?(阿里面试题) 16、列举IE 与其他浏览器不一样的特性? 17、99%的网站都需要被重构是哪本书上写的?

后台管理UI的选择

怎甘沉沦 提交于 2019-12-18 00:36:26
后台管理UI的选择 目录 一、EasyUI 二、DWZ JUI 三、HUI 四、BUI 五、Ace Admin 六、Metronic 七、H+ UI 八、Admin LTE 九、INSPINIA 十、LigerUI 十一、FineUI 十二、其它UI 十三、总结 最近要做一个企业的OA系统,以前一直使用EasyUI,一切都好,但感觉有点土了,想换成现在流行的Bootstrap为基础的后台UI风格,想满足的条件应该达到如下几个: 1、美观、大方、简洁 2、兼容IE8、不考虑兼容IE6/IE7,因为现在还有很多公司在使用Win7系统,系统内置了IE8 3、能通过选项卡打开多个页面,不想做单页,iframe也没关系 4、性能好,不要太笨重 5、最好以Bootstrap为基础 6、还希望在以后别的系统中能够复用。 一次次反复纠结的选择开始了,给大家介绍下我考虑过的UI,也给大家一个参考。 一、EasyUI easyui是一种基于jQuery的用户界面插件集合。 easyui为创建现代化,互动,JavaScript应用程序,提供必要的功能。 使用easyui你不需要写很多代码,你只需要通过编写一些简单HTML标记,就可以定义用户界面。 easyui是个完美支持HTML5网页的完整框架。 easyui节省您网页开发的时间和规模。 easyui很简单但功能强大的。 优点:轻量、功能强大、免费

javaScript与css、html常见的兼容

China☆狼群 提交于 2019-12-07 10:35:33
  最近几天总是遇到兼容问题,就整理了一下javaScript和html、css出现的常见兼容。有不全面或不对的欢迎大家指正。也希望这条博客可以帮到一些刚学习的前端的朋友。 一、javaScript出现的兼容问题 1、DOM样式操作 获取行内/非行内样式(不能用来设置,只能获取) 正常浏览器写法: getComputedStyle(element, false).attr 获取外部样式,false表示不是伪类。(IE9可以,IE8以下不支持) IE浏览器写法: element.currentStyle.attr // function getStyle(ele,attr){ //ele元素,attr属性 if (ele.currentStyle) { return ele.currentStyle[attr]; } else { return getComputedStyle(ele, false)[attr]; } 2、事件对象的获取 正常浏览器:事件处理函数的第一个参数 ( eve) IE浏览器:通过window找event属性 (window.event) 兼容写法: element.onclick = function (eve) { var e = eve || window.event; console.log(e); } 3、键盘事件对象 正常浏览器:e

让人“蛋碎”的ie兼容问题

不问归期 提交于 2019-12-07 02:16:41
前段时间的一个项目,要做ie8及以上的兼容,那个做的我真的是蛋疼,菊花紧啊。。。。 当时就想问问微软ie的部门,你们到底想干虾米,这不是要逼死前段工程师吗。。。。 然后去Google上面找了好多关于兼容的文档,然后归类了一些,希望有跟我一样碰到这种问题的朋友们能够得到帮助,嘿嘿 以下我总结简单总结了几条: 不管你是不是做兼容,做为一个前端工程师,都要养成一个习惯,那就是用类(class)来控制样式(css),用id来控制脚本(JavaScript),那这是为什么呢? 道理其实很简单,在ie8以下的浏览器中,对于以下 #first #second{ color:red; } 这种写法是找不到这个元素的,所以有时候你会发现在google浏览器里很和平的事情,到了ie中这个css就完全消失了。 还有控制样式为什么要用id呢?因为id获取到元素的步骤是最节约资源的,而且也是最直接的,所以各位新手小白前端们, 记住这个重要的步骤吧,肯定会少走很多弯路的 2. 因为要兼容ie8,而ie8是不支持css3.0的,有可能你的第一反应是,那就不用那些比较酷炫的效果喽,然而如果你只是这么想,那就图样了。。。 在css2.0中,对于css那些比较好用的选择器,也是不支持的,举个最简单的例子哈,css2.0是支持:first-child这个选择器的,而:last-child是不支持的,是不是很无语

IE6兼容笔记

孤街醉人 提交于 2019-12-06 06:37:38
如果IE678都已经淘汰,虽说也极少数企业单位会用到IE低版本的深坑浏览器,不过基本上现在做web前端开发都较少去兼容IE的低端浏览器。想想当初学习web前端,不可避免的要了解关于IE浏览器兼容方面上的处理,即使在工作以后,基本上也没有处理过IE低版本浏览器的兼容问题。现在仅仅是把当初的一个笔记记录一下。 1.兼容IE6背景图片透明 第一种方法:把图片更换为png-8图片 第二种方法:在head标签下引入js代码 <!--[if IE 6]> <script type="text/javascript" src="js/DD_belatedPNG_0.0.8a.js"></script> <script type="text/javascript"> DD_belatedPNG.fix('*'); </script> <![endif]--> 2.ie6下margin双倍问题 IE6会在特定的条件下,将设置的横向margin值变成双倍。条件: 1.元素必须浮动(float); 2.元素必须具有横向margin,margin-left、margin-right 3.元素必须块元素 4.浏览器必须是ie6 解决方案 设置浮动元素的_display:inline; 注意:IE6双边距产生是父子之间、兄弟之间不会产生 示例(ietester 测试 ie6): 测试结果: 3

如何才能做一个合格的前端开发者呢?

梦想与她 提交于 2019-12-04 21:44:54
如何才能做一个合格的前端开发者呢? 第一,必须掌握基本的Web前端开发技术,其中包括:CSS、HTML、SEO、DOM、BOM、Ajax、Java等,在掌握这些技术的同时,还要清楚地了解它们在不同浏览器上的兼容情况、渲染原理和存在的Bug。 第二,在一名合格的前端工程师的知识结构中,网站性能优化、SEO和服务器端的基础知识也是必须掌握的。 第三,必须学会运用各种工具进行辅助开发。 第四,除了要掌握技术层面的知识,还要掌握理论层面的知识,包括代码的可维护性、组件的易用性、分层语义模板和浏览器分级支持,等等。 来源: CSDN 作者: 前端碎碎念 链接: https://blog.csdn.net/zhongqw_00/article/details/88929162

让Bootstrap 3兼容IE8浏览器

痴心易碎 提交于 2019-12-04 13:19:11
让Bootstrap 3兼容IE8浏览器 看到这篇文章有越来越多的人看,我决定给大家节省时间,废话少说。有几个点大家要注意。 1、本地调试需要Web Server(如IIS、Apache,Nginx),单纯地本地打开文件不能看到兼容效果。 2、如果你发现已经引用了 respond.js 和Bootstrap,仍无效果,请查看你的Bootstrap是否使用了CDN文件。(详情看第4点) 3、本文主要针对Bootstrap3版本,如果你是Bootstrap2 ,请搜索 BSIE ,还可以兼容IE6浏览器. 4、Bootstrap3 需要Html5文档声明 最近在研究Bootstrap( 官方 , Github )这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单、按钮组、按钮下拉菜单、导航、导航条、面包屑、分页、排版、缩略图、警告对话框、进度条、媒体对象等。Bootstrap他们预先定义好,等要进行正式制作网页的时候,我们可以直接用里面的class就可以了。 今天不多介绍Bootstrap的功能,以后有机会可以重点介绍一下,确实十分优秀。 响应式布局 ,定制性强,组件丰富,与Jquery完美契合。 进入主题,说说Bootstrap 3的兼容IE8问题。 Bootstrap是一个响应式的布局

WEB前端开发人员须知的常见浏览器兼容问题及解决技巧

≡放荡痞女 提交于 2019-12-04 02:33:04
所谓的浏览器兼容性问题,是指因为不同的浏览器对同一段代码有不同的解析,造成页面显示效果不统一的情况。在大多数情况下,我们的需求是,无论用户用什么浏览器来查看我们的网站或者登陆我们的系统,都应该是统一的显示效果。所以浏览器的兼容性问题是前端开发人员经常会碰到和必须要解决的问题。 在学习浏览器兼容性之前,我想把前端开发人员划分为两类: 第一类是精确按照设计图开发的前端开发人员,可以说是精确到1px的,他们很容易就会发现设计图的不足,并且在很少的情况下会碰到浏览器的兼容性问题,而这些问题往往都是浏览器的bug,并且他们制作的页面后期易维护,代码重用问题少,可以说是比较牢固放心的代码。 第二类是基本按照设计图来开发的前端开发人员,很多细枝末节差距很大,不如间距,行高,图片位置等等经常会差几px。某种效果的实现也是反复调试得到,具体为什么出现这种效果还模模糊糊,整体布局十分脆弱。稍有改动就乱七八糟。代码为什么这么写还不知所以然。这类开发人员往往经常为兼容性问题所困。修改好了这个浏览器又乱了另一个浏览器。改来改去也毫无头绪。其实他们碰到的兼容性问题大部分不应该归咎于浏览器,而是他们的技术本身了。 这篇文章主要针对的是第一类,严谨型的开发人员,因此这里主要从浏览器解析差异的角度来分析兼容性问题 浏览器兼容问题一:不同浏览器的标签默认的外补丁和内补丁不同 问题症状:随便写几个标签

H5嵌入原生开发小结----兼容安卓与ios的填坑之路

試著忘記壹切 提交于 2019-12-03 21:26:40
一开始听说开发H5,以为就是做适配现代浏览器的移动网页,心想不用管IE了,欧也。到今天,发现当初too young too simple,兼容IE和兼容安卓与IOS,后者让你更抓狂。接下来数一下踩过的坑。主要分UI展示,键盘,输入框等等。解决bug最苦恼的问题不是没有解决方案,而是你没有找到真正的原因。再就是现象难以重现,每次都要发布代码,然后到手机app中去测试,模拟。这些地方会耗费大量的精力。 一、UI相关 1.安卓4.4以下不支持fixed布局。 fixed布局的作用之一就是在手机键盘弹起来的时候,可以自动把页面顶起来。如果不支持的话,换绝对定位也是可以的。但是绝对定位某些机型比如sm-n7508,华为m7上还是没有能顶起来。IOS没有这个问题。 2.小于1px显示问题 部分安卓机器(比如小米)的分辨率低,如果border的宽度小于1px。安卓机出现一种边框消失了的现象。样式上有点奇怪,IOS没有这个问题。 一开始以为是别的元素挡住了,但是调了半天无解。最后突然意识到是不是计算出来的高度有小数导致的。然后马上取整: $target.css("height", Math.ceil (maxline * lineHeight)); 但是,华为的某些类型的是上面显示不正常,出来一排点点。 再修正一下: $target.css("height", Math.ceil(maxline

2017年-Web前端面试题(HTML至Nodejs)(转)

怎甘沉沦 提交于 2019-12-03 20:24:22
【原】2017年-Web前端 面试题 (HTML → Nodejs) 出自作者小矮人Web前端,博文地址: http://www.cnblogs.com/itlkNote/ 文中有少许重复问题! 第一阶段 HTML、CSS、HTML5、CSS3 1、XHTML与HTML的有何异同? 2、介绍一下CSS的盒子模型?弹性盒子模型是什么? 3、Doctype的作用?标准模式与兼容模式各有什么区别? 4、HTML5 为什么只需要写 <!DOCTYPE HTML>? 5、行内元素有哪些?块级元素有哪些? 空(void)元素有那些? 6、页面导入样式时,使用link和@import有什么区别? 7、介绍一下你对浏览器内核的理解? 8、常见的浏览器内核有哪些? 9、HTML5有哪些新特性、移除了那些元素?如何处理HTML5新标签的浏览器兼容问题?如何区分 HTML 和 HTML5? 10、简述一下你对HTML语义化的理解? 11、iframe有那些缺点? 12、列出display的值,说明他们的作用?position的值, relative和absolute定位原点是? 13、一个满屏 品 字布局 如何设计? 14、常见兼容性问题? 15、如果需要手动写动画,你认为最小时间间隔是多久,为什么?(阿里面试题) 16、列举IE 与其他浏览器不一样的特性? 17、99%的网站都需要被重构是哪本书上写的