Web端对于宽度有各种定义，比如innerWidth，outerWidth，clientWidth，offsetWidth。不同语境下有不同的含义，PC端与移动端的表现也有不同，还可能与缩放水平、滚动条、viewport设置等因素相关。

胖箭头函数（Fat arrow functions），又称箭头函数，是一个来自ECMAScript 2015（又称ES6）的全新特性。有传闻说，箭头函数的语法=>，是受到了CoffeeScript 的影响，并且它与CoffeeScript中的=>语法一样，共享this上下文。

await/async 是 ES7 最重要特性之一，它是目前为止 JS 最佳的异步解决方案了。虽然没有在 ES2016 中录入，但很快就到来，目前已经在 ES-Next Stage 4 阶段。

那些不推荐使用的html标签

图片可以让页面更有吸引力，尤其是处理的恰当的时候，但问题是，图片的处理是个麻烦事情，它的创建和裁剪对于一个普通人来说是个困难的任务

经常搜集整理一下网上发行的好代码，能不断扩充自己的知识库，这些知识在不用的时候就放着，需要用到的时候，从知识库里拿出来，会省掉很多的麻烦。

今天我们来深入研究一下 Chrome 的网络协议栈，来更清晰的描述早期网络加载（像 preload 和 prefetch）背后的工作原理，让你对其更加了解。

:focus-within 是一个新的CSS伪类( pseudo-class)，它跟 :focus 、 :hover 很相似。这个伪类的作用在使用了 :focus-within 的元素成为焦点或它的子元素成为焦点时显现。

pattern属性是HTML5里出现的新属性，它适用于type类型为text, search, tel, url, email, 和 password等的input元素上，配合:valid伪类，就能实现JavaScript里的正则表达式等效的校验算法。

我发现一个有趣的事情，竟然能在浏览器console里显示SVG图片和SVG动画！我迫不及待的要把这写出来，我想知道是否还有其他人之前也发现了这个用法。同时也为这个功能感到兴奋。我是在经过一系列的错误debug、测试和研究中偶然发现了可以在console里显示SVG图片，不仅仅能显示，而能够运行SVG动画。下面是一个动画效果截图：

今年三月，微软宣布 Edge 浏览器将支持 CSS 变量。这个重要的 CSS 新功能，所有主要浏览器已经都支持了。本文全面介绍如何使用它，你会发现原生 CSS 从此变得异常强大。

初次看到[].forEach.call()这样的代码，我觉得这种写法很有趣，为什么要这样写？为什么要用空数值引申出的方法？

用forEach你将会得到执行错误的异常信息。这是因为，document.querySelectorAll()返回的不是一个数组，而是一个NodeList。

我遇到的‘%2F’只是个例子，还有很多这样的字符不能吧包含在文件名中，它们同样不能被RewriteCond解析。

空格在calc()的加减操作中有着非常重要的作用，这跟普通的编程语言中的用法有所区别，我想，这可能是因为在CSS中，你可以用“aaa-bbb”这样中间有减号的类名，而在多数的编程语言中，这样的变量名是不允许的。

专门针对IE的条件性注释(Conditional comments)是个很奇葩的东西，它是专门给IE浏览器准备的，因为其它浏览器根本不能识别这种标记。但当IE的版本到到达10、11后，开始不支持这种条件性注释

HTML <header> 元素用来表示一些前言性质或导航类的内容。它可以包含一些标题性质元素，也可以放置一些比如logo，搜索框，或其它的<header>元素等。

Base64 Encode 1x1px透明GIF图片能干什么？这种图片的特征就是体积最小化，最大限度的减少带宽。而且是透明的，具有隐身作用。用到的场景很多，比如测试浏览器是否支持data URI技术，或用来做一个透明的浮动层，或在lazy load图片时用它来做占位符

Address元素(<address>)是用来存放地址信息的，它可以和<article>元素配对来提供文章作者的联系信息。对它的使用需要注意一下几点

经过统计，发现恶意攻击的频率并不高，大多数都是404攻击，也就是向服务器请求不存在的页面资源。按按常理，Web服务器对404请求访问很容易应付的，消耗不了多少资源性能，但Wordpress网站为什么面对404攻击如此脆弱不堪呢？

现代浏览器里提供的新的API越来越倾向于移动手机应用，而不是传统的桌面应用，比如JavaScript地理位置信息API。另外一个只针对手机应用的JavaScript API就是振动(Vibration) API。很明显，这个API就是允许mobile程序员使用JavaScript调用手机的振动功能，并且能设定振动的方式和时长。

昨天我了解到Chrome调试工具一个小巧的调试方法，在WDCC期间， Marcus Ross（@zahlenhelfer） 介绍了，chrome调试工具各种调试方法，这个只是其中一种，现在我来给大家秀下。

今天在国外的网站上看到了很多看似简单却又非常强大的纯CSS绘制的图形，里面有最简单的矩形、圆形和三角形，也有各种常见的多边形，甚至是阴阳太极和网站小图标，真的非常强大，分享给大家。

HTML5中提供了在网页文档之间相互接收与发送信息的功能。使用这个功能，只要获取到网页所在窗口对象的实例，不仅仅同源(域+端口号)的web网页之间可以互相通信，甚至可以实现跨域通信。

getBoundingClientRect()用于获得页面中某个元素的左，上，右和下分别相对浏览器视窗的位置。