soindy

根据Sacha Greif今年8月25日做的统计(3000+人参加)(https://medium.com/@sachagreif/the-state-of-javascript-front-end-frameworks-1a2d8a61510#.plsk70teh)来看:主要竞争者ReactAngularAngular 2EmberVueBackbone排序条件: * 从来没有听过

浮动布局浮动是一种半脱离标准流的排版方式没有居中对齐使用 margin: 0 auto; 没有作用不区分块级元素/行内元素/行内块级元素,因为这标准流中的概念 浮动的排序规则相同方向的浮动元素,先浮动的显示在前面.因为浮动只会盖住标准流.不同方向的浮动元素,左浮找左浮,右浮找右浮浮动元素浮动之后的位置,由浮动元素浮动之前在标准流中的位置来决定.贴靠现象: 如果浮动的最后一个元素超过

相对定位相对定位就是相对于自己以前在标准流的位置来移动,不脱离标准流.需要配合top left right bottom 使用.会在标准流中占用空间.注意点同一个方向只能有一个属性由于不脱离标准流,所以区分行内元素,块级元素,行内块级元素由于不脱离标准流,所以相对定位的元素会占用标准流的位置,所以设置其margin/padding属性的时候会影响标准流的布局(给定位之前的盒子)使用场景微调

继承性作用给父元素设置一些属性, 子元素也可以使用, 这个我们就称之为继承性注意点: 1.并不是所有的属性都可以继承, 只有以color/font-/text-/line-开头的属性才可以继承 2.在CSS的继承中不仅仅是儿子可以继承, 只要是后代都可以继承 3.继承性中的特殊性 * a标签的文字颜色和下划线是不能继承的 * h标签的文字大小是不能继承的应用场景一般用于设置网页上的一些共性

转载自: 野狗《如何避免页面卡顿》什么是页面卡顿？如下：当拖动页面或者滚动的时候页面一卡一卡的，看起来不连贯，我们就说页面卡了，这是一种非常不友好的体验，怎么衡量页面卡顿的情况呢？失帧和帧率FPS如果你家里买了电视盒的话，在设置里面应该会有一个输出设置：上面选中的60Hz就是帧率(frame per second)，即一秒钟60帧，换句话说，一秒钟的动画是由60幅静态图片连在一起形成的。60fps是

转载自: 野狗《从 Chrome 源码看浏览器如何计算 CSS》 在 《 HTML 如何避免页面卡顿》这篇里面介绍了浏览器渲染页面的过程：并且《从Chrome源码看浏览器如何构建DOM树》介绍了第一步如何解析Html构建DOM树，这个过程大概如下：浏览器每收到一段html的文本之后，就会把它序列化成一个个的tokens，依次遍历这些token，实例化成对应的html结点并插入到DOM树里面。我将在

转载自: 【前端攻略】：玩转图片Base64编码引言　　图片处理在前端工作中可谓占据了很重要的一壁江山。而图片的 base64 编码可能相对一些人而言比较陌生，本文不是从纯技术的角度去讨论图片的 base64 编码。标题略大，不过只是希望通过一些浅显的论述，让你知道什么是图片的 base64 编码，为什么我们要用它，我们如何使用并且方便的使用它，并让你懂得如何去在前端的实际工作中运用它。什么是 ba

转载自: 野狗《从 Chrome 源码看浏览器如何 layout 布局》假设有以下html/css：<div style="border:1px solid #000; width:50%; height: 100px; margin: 0 auto"></div>这在浏览器上面将显示一个框：为了画出这个框，首先要知道从哪里开始画、画多大，其次是边缘stroke的颜色，就可以把它画出来了：void

AngularJS 设置元素样式,代码如下:<div class="panel-body" ng-style="{display: '{{date.display}}'}"> <div ng-style="{height: '{{data.height}}px'}"></div></div>

if( value ) {}会判断以下情况: * null * undefined * NaN * empty string (“”) * 0 * false 以上情况包含所有的JavaScript的falsy值.单独判断某种情况的话可以用typeofif( typeof foo !== 'undefined' ) { // foo 为undefined}

AngularJS 使用 ng-src 替换了src :<img ng-src="{{imageUrl}}">错误写法:<img src="http://www.coderlady.com/avatar/{{hash}}"/>正确写法<img ng-src="http://www.coderlady.com/avatar/{{hash}}"/>这是因为在加载页面的时候, 在Angular加载完成之

出于安全考虑,最新版的浏览器默认本地的 XML 已经不能访问本地的XSLT 文件了,不过 HTML 文件仍能访问项目目录下的 CSS 文件.解决办法:只需要本地起个server即可: 1. Python 2.x python -m SimpleHTTPServerPython 3.xpython3 -m http.server然后访问: http://localhost:8000/yourfi

EChart 需要提前初始化容器大小. 设置width和height即可

上图所示,设置了border: none 仍然有边框,这是因为设置了height 和 weight, 去掉即可. 原理稍后研究~

概述优点: * 解决了设备可见的差异性 缺点: * 兼容性代码多,工作量大,加载速度受影响 * 对原有网站布局会产生影响,用户判断未必精准 原则: * 设计初期要考虑页面如何在多终端展示 渐进增强: * 充分发挥硬件设备的最大功能(一些效果可以在低端设备放弃)实现CSS3 - Media Query 最简单的方式借助原生的Java

裁剪超出标签范围的内容清除浮动.参考CSS 浮动(float)注意点当两个盒子嵌套时,避免设置内层margin-top时,外层盒子也被顶下来. CSS盒子模型注意点

H5学习路线图前端入门: 页面布局与重构, HTML CSS 移动前端开发: 响应式布局, HTML5 CSS Web交互开发: JavaScript, jQuery Ajax 前端高级开发: 原生开发, 移动端开发HTML5基础H5结构标签,标签类型H5新标签语义,属性语法H5新功能标签H5表单元素H5视频,音频CSSCSS盒子模型,CSS浮动,定位,CS

Frontend Knowledge Structure前端知识体系结构及学习资料 前端学习切勿跟风! 因为前端框架的更新几乎以周为频率.尤其对于新手而言,与其追一些新出的框架,打好基础才是关键.学好JavaScript对以后使用一些工具或框架有很大的帮助.

[Error: Module version mismatch. Expected 46, got 48.] { [Error: Cannot find module ‘./build/default/DTraceProviderBindings’] code: ‘MODULE_NOT_FOUND’ } { [Error: Cannot find module ‘./build/Debug/DT

前端网: Html+Css布局技巧 (1)前端网: html+css布局(2)酷客: CSS 布局:40个教程、技巧、例子和最佳实践慕课网: 史上最全Html和CSS布局技巧bingkingboy的博客: HTML与CSS布局技巧总结 background-position和雪碧图(CSS Sprites)用法稀有猿诉: 初级前端的专业的CSS技巧

使用crypto-js加密时报错: sha256.js:3 Uncaught ReferenceError: CryptoJS is not defined(…)(anonymous function) @ sha256.js:3(anonymous function) @ sha256.js:179 aes.js:3 Uncaught ReferenceError: CryptoJS is n

使用crypto-js加密时报错: aes.js:77 Uncaught TypeError: Cannot read property ‘extend’ of undefined(…)(anonymous function) @ aes.js:77(anonymous function) @ aes.js:212 scan.html:26 Uncaught ReferenceError: S

这是因为同时启了好几个服务.方法1: 在IDEA中关闭方法2: 在活动监视器中关闭

同时将select的normal和select状态的outline设为none..selected_search { -webkit-appearance: none; -moz-appearance: none; outline: none;}.selected_search select{ background: transparent; border

设置series的时候确保name,data,type这3个必须的属性设置上了.series: [{ name:'得到', type:'line', data:[100.,311.3,322.8,]}],

input,button,a { outline:0 none !important; blr:expression(this.onFocus=this.blur());}

场景window.onresize或者$(window).resize()触发两次.比如浏览器全屏显示,如果使用screen.availHeight重布局屏幕会闪两次,因为resize方法会进2次.而且每次screen.availHeight都不一样.原因和浏览器的自身实现有关系.不同的浏览器和操作系统实现可能不一样,具体自己可以去玩一下. 参考: stackoverflow错误实现代码win

value: string类型 属性的值. 用于input/form/textarea元素, innerHTML: string类型,元素的HTML内容. 用于div/p/span/td/ul 等.

两个盒子是嵌套关系, 如果设置了里面一个盒子的margin-top,外边的盒子也会被顶下来.可以给外边的盒子添加border属性,避免上面现象.但是如果要控制这种嵌套关系的话,最好不要使用margin属性,因为margin本身就是控制兄弟关系的.而应该使用padding属性.使用margin: 0 auto; 可以控制水平居中,而且只能控制水平方向.

安装Compass即可sudo gem install compassCompass是Sass的工具库,在其基础上封装了一些模块,补充其功能.之于Javascript和jQuery、Ruby和Rails、python和Django的关系.详见: 1. compass官网 2. 阮一峰: Compass用法指南