YUSIR 完美CODING世界

而修改dom的几何信息例如height，动画中的left移动等，动画中每一帧都对布局有影响从而浏览器会重新计算生成布局树再分层，生成绘制指令再分块，再光栅化，然后交给GPU重新渲染。但是Transform则不会影响，浏览器只需要一次生成这个元素的位图，并在动画开始的时候将它提交给GPU去处理。之后，浏览器不需要再做任何布局、 绘制以及提交位图的操作。ball1的动画使用transform左移100px， ball2的动画使用left左移100px。

input[type="file"]的样式在各个浏览器中的表现不尽相同：1. chrome:2. firefox:3. opera:4. ie:5. edge:另外，当我们规定 input[type="file"] 的高度，并把它的行高设置成与其高度相等后，chrome中难看的样式出现了：“未选择任何文件”这一行并没有竖直居中。这些浏览器中的...

1. 什么是Shadow DOM?Shadow DOM 如果按照英文翻译的话可以理解为 影子DOM, 何为影子DOM呢？可以理解为一般情况下使用肉眼看不到的DOM结构，那如果一般情况下看不到的话，那也就是说我们无法直接控制操纵的DOM结构。Shadow DOM 它是HTML的一个规范，它允许在文档(document)渲染时插入一颗DOM元素子树，但是这个子树不在主DOM树中。它允许浏览器开...

首先，浏览器支持什么字体取决于用户系统里安装了什么字体，比如CSS中这么写：font-family:"微软雅黑","黑体","宋体";那么浏览器会尝试按照从左到右的顺序依次应用，假设用户电脑上没有安装微软雅黑，那么就用黑体。接下来，开发人员有点郁闷了，这个世界有这么多字体，我怎么保证用户电脑上有我希望的字体呢？美工给我的完美效果，到了老板电脑上一团糟，会不会被骂死？这时，CSS勇敢的站...

利用@media screen实现网页布局的自适应优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小。只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽值1280分辨率以上（大于1200px）@media screen and (min-width:1200px){ #page{ width: 1100px; }#content,...

前言写过邮件的html的童学应该都知道，邮件的html一般都用table来布局，为什么呢？原因是大多数的邮件客户端（比如Outlook和Gmail），会过滤HTML设置，让邮件面目全非。经过多次的邮件编写实践及度娘的指导，我发现，编写HTML Email的窍门，就是使用15年前的网页制作方法。自制兼容outlook与foxmail邮件模版局部重点规则1. Doctype目前...

前端很多项目中，都有文件下载的需求，特别是JS生成文件内容，然后让浏览器执行下载操作（例如在线图片编辑、在线代码编辑、iPresst等）。　　但受限于浏览器，很多情况下我们都只能给出个链接，让用户点击打开-》另存为。如下面这个链接：<a href=”file.js”>file.js</a>用户点击这个链接的时候，浏览器会打开并显示链接指向的文件内容，显然，这并没有实...

在调试代码的时候我就遇到一个问题，HTML元素title里面通常只显示一行，那我想要他换行，就是多行显示，如何实现？JS代码里面比如Alert里面又该如何换行？    经过我的一番实验       要实现这种效果有几种方法，并且非常简单：    在HTML元素中，可以使用：1.直接按“回车键”换行，代码中换行，实际中也会换行     

history.back(-1):直接返回当前页的上一页，数据全部消息，是个新页面history.go(-1):也是返回当前页的上一页，不过表单里的数据全部还在history.back(0) 刷新 history.back(1) 前进 history.back(-1) 后退

之前写的代码不是很规范 , 在今天测试下发现360浏览器等等的浏览器使用兼容模式会有很多不兼容 , 网上了解过一下 , 说是很多浏览器的兼容模式可能就是为了兼容IE7之前的网站代码 , 而非我们字面理解的'兼容'二字  ...  OK!跑题了 ... 我的解决方案是在页面head加  告诉浏览器最少使用IE11的内核去解析  能解决IE7内核下的很多问题再来学习一番： 

colspan是横向合并；rowspan是纵向合并。在表格制作中，常常要用到列合并与行合并的属性。下面是一个七行三列的表格，我们来观察一下列合并与行合并后的情况。

关于z-index我们的共识共识一首先，我们都同意，z-index对于普通盒子是无效的，这里的“普通盒子”是除了下文我会提到的“神奇盒子”外的所有盒子，至于什么是“神奇盒子”请慢慢看。 对于普通盒子，不管z-index值如何，写在html文档中后面的块会在写在前面的盒子上面，float的盒子会在没有float的盒子上面，文字等inline、inline-block元素会在blo

[html] view plain copyinput id="fileSelect" type="file" accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" />    

一、问题button class="am-btn am-btn-default am-btn-xs am-text-secondary" data-id="99" data-type=1>span class="am-icon-pencil-square-o">span>修改button>11页面上有这样一个按钮，每次点击这个按钮的时候，执行完button的click事件后，会自动的

Chrome 控制台console的用法大家都有用过各种类型的浏览器，每种浏览器都有自己的特色，本人拙见，在我用过的浏览器当中，我是最喜欢Chrome的，因为它对于调试脚本及前端设计调试都有它比其它浏览器有过之而无不及的地方。可能大家对console.log会有一定的了解，心里难免会想调试的时候用alert不就行了，干嘛还要用console.log这么一长串的字符串来替代alert输出

_blank 浏览器会另开一个新窗口显示链接_self，在同一框架或窗口中打开所链接的文档。此参数为默认值，通常不用指定。 _parent，将链接的文件载入含有该链接框架的父框架集或父窗口中。如果含有该链接的框架不是嵌套的，则在浏览器全屏窗口中载入链接的文件，就象_self参数一样。_top，在当前的整个浏览器窗口中打开所链接的文档，因而会删除所有框架_search 在浏览