计算机网络知识，是面试常考的内容，在实际工作中也常常会涉及到. 最近总结了66条计算机网络相关的知识点，大家一起看一下吧：. 1.比较http 0.9和http 1.0. http0.9只是一个简单的协议，只有一个GET方法，没有首部，目标用来获取HTML. HTTP1.0协议大量内容：首部，响应码，重定向，错误，条件请求，内容编码等.

前端的最重要的基础知识点是什么. 原生 javaScript， HTML, CSS.. EventLoop和渲染机制. 各类工程化的工具原理以及使用，根据需求定制编写插件和包. （webpack的plugin和babel的预设包）. 数据结构和算法（特别是 IM以及超大型高并发网站应用等，例如 B站）.

本文适合无论是否有爬虫以及 Node.js基础的朋友观看~. 使用 Node.js爬取网页资源，开箱即用的配置. 将爬取到的网页内容以 PDF格式输出. 如果你是一名技术人员，那么可以看我接下来的文章，否则，请直接移步到我的 github仓库，直接看文档使用即可. 仓库地址: 附带文档和源码,别忘了给个 star哦.

性能优化是一门大学问，本文仅对个人一些积累知识的阐述，欢迎下面补充. 抛出一个问题，从输入 url地址栏到所有内容显示到界面上做了哪些事. DNS 服务器请求解析该 URL 中的域名所对应的. 2.建立 TCP连接（三次握手）;. 3.浏览器发出读取文件( URL 中域名后面部分对应的文件)的 HTTP 请求，该请求报文作为.

这段时间在整理前端部分代码规范，初步想法是从HTML、CSS、Javascipt、项目文件目录四部分是整理. 之前已经整理完了 CSS编码规范，有兴趣可以了解下. [强制] 使用 4 个空格做为一个缩进层级，不允许使用 2 个空格 或 tab 字符. 对于非 HTML 标签之间的缩进，比如 script 或 style 标签内容缩进，与 script 或 style 标签的缩进同级.

随着 4G 的普遍以及 WiFi 的广泛使用，手机上的网速已经足够稳定和高速，以视频为主的 HTML5 也越来越普遍了，相比帧动画，视频的表现更加丰富，前段时间开发了一个以视频为主的移动端 HTML5，在这里介绍一些实践经验. 我们希望视频播放时可以全屏播放，没有进度条、播放按钮等与系统相关的元素，可以在视频上方增加自定义的元素（比如一个跳过按钮），类型下面的效果：.

（1）清除浏览器默认样式. （1）项目开发初期就定义好. （2） reset.css 在引入的时候一定要放在第一位. （3）不同的产品 reset.css不一样. 3.table合并边框间距. table { border-collapse: collapse; // 合并边框 border-spacing: 0; //边框间距.

原文收录在我的 GitHub博客 ( https://github.com/jawil/blog) ，喜欢的可以关注最新动态，大家一起多交流学习，共同进步，以学习者的身份写博客，记录点滴. 按照格式推荐好用的插件有福利哦，说不定会送1024论坛邀请码，好自为之，你懂的，嘿嘿嘿. 由于github的issues没有TOC菜单栏导航，所以这里方便大家查看，先安利一款Chrome浏览器的插件，感谢github用户@BBcaptain 推荐.

最近火热的有声娱乐平台 APP，企鹅 FM，在8月28日鬼节前夕，联合《盗墓笔记》推出了“勇敢者的游戏”活动. 作为一个 UI 工程师，在这个移动互联网叱咤风云的时代，每次看到朋友圈中被分享的各种花样 H5 页面，总是心痒难耐，也想做有着酷炫动画和带感声效的 H5 呢. 回想到做鬼节活动页的时候，接近午夜零点还在调整页面效果，看着页面上渐隐渐现的可怕画面，活生生吓到了自己，也是蛮难忘的.

在阅读本文之前，建议先阅读之前的一篇文章：“ 面向设计的半封装web组件开发”，便于理解文章的一些解惑. 前端这几年的发展都是有目共睹的，然而，如果按照已经落地投入实践的标准梳理下，会发现，基本上都是偏后的JS开发层面的，比方说Node.js下的前后端分离，MV*库，React.js，各种包管理工具及前端集成解决方案等.

在这个巨变的时代，技术选型是个很难做决定的事情，而移动应用技术领域在几个巨头（Google，Facebook，Apple etc.）的带动下更是日新月异. 所以说要选择一个适合业务需求并且匹配开发人员能力的技术方案并不是一件简单的事情. 我也只是在移动开发上做过一点微小的工作，此处仅能抛个砖，希望各位有玉的大神尽管砸过来.

作为一名前端，在拿到设计稿时你有两种选择：. 2.加上高级大气上档次狂拽炫酷屌炸天的动画让页面动起来. 作为一个有志向的前端，当然是选2啦. 可是需求时间又很短很短，怎么办呢. 这次就来谈谈一些动画设计的小技巧，能在你时间不多又没有动画想法的时候瞬间让页面增色不少. 同时也会谈及移动端H5页面的优化细节与关键点，因此本文章将分为 动效篇和.

承接上文《 玩转HTML5移动APP页面（动效篇）》，上次说的是让页面动起来的一些小技巧. 而页面动起来的根基是功能可用的页面，因此有必要分享一些优化细节的技巧和方向，熟悉掌握一些方法论还是会对页面开发大大提高效率的，并且也能防止疏忽缺漏. 涉及的动画十分多，用的元素也十分多，请务必使用雪碧图（Sprite）.

原文： http://www.smashingmagazine.com/2014/10/21/providing-a-native-experience-with-web-technologies/. 翻译： 叮当当咚当当小胖妞呀 杀手爱elva Ivan_z3 肖弦. 根据最近的一篇 报告显示，HTML是移动应用开发人员使用最多的语言，开发人员对于选择哪种网页技术考虑的最主要因素，是代码的跨平台便携性和开发的低成本性.

腾讯Bugly特约作者：贺辉超. H5，即 HTML5，是新一代的 HTML 标准，加入很多新的特性. 离线存储（也可称为缓存机制）是其中一个非常重要的特性. H5 引入的离线存储，这意味着 web 应用可进行缓存，并可在没有因特网连接时进行访问. H5 应用程序缓存为应用带来三个优势：. 离线浏览 用户可在应用离线时使用它们.

这个想必大家都知道，当页面在手机上显示时，增加这个meta可以让页面强制让文档的宽度与设备的宽度保持1:1，并且文档最大的宽度比例是1.0，且不允许用户点击屏幕放大浏览. 这两个属性分别对ios上自动识别电话和android上自动识别邮箱做了限制. 桌面浏览器中想要获取滚动条的值是通过document.scrollTop和document.scrollLeft得到的，但在iOS中你会发现这两个属性是未定义的，为什么呢.

由于很多人都在用JavaScript、HTML5和WebGL技术创建基于浏览器的3D游戏，所有JavaScript 3D游戏引擎是一个人们主题. 基于浏览器的游戏最棒的地方是平台独立，它们能在iOS、Android、Windows或其他任何平台上运行. 有很多的JavaScript能够用于创建基于浏览器、使用HTML5和WebGL的3D游戏.

最近在做手机页面时，遇到数字输入的键盘的问题，之前的做法只是一刀切的使用 type="tel"，不过一直觉得九宫格的电话号码键盘上的英文字母太碍事了. 于是想要尝试其它的实现方案，最终的结论却令人沮丧. 不过也趁机详细了解了下 pattern这个属性. type="tel" 和 type="number" 的区别.

我们首先需要创建一个 index.html文件，里面写上一些简单的 html和 css代码：. 以上的三个 标签都是用来处理跟图片相关的内容的，详细的处理会在后续的js代码中给出. 而 id为 show_edit 和 id为 show_pic这两个是为了图片的预览和查看最后的图片生成结果.

1、-webkit-tap-highlight-color:rgba(255,255,255,0)可以同时屏蔽ios和android下点击元素时出现的阴影. 备注：transparent的属性值在android下无效. 2、-webkit-appearance:none可以同时屏蔽输入框怪异的内阴影.

四年前，Youtube官方曾宣布在网站上 实验性的支持HTML5

前端UI框架越来越受到新人追捧，下边小编为大家列出目前最受欢迎、最优秀的前端框架以供大家选择. 目前开源社区最受欢迎的项目之一，可谓大名鼎鼎了，最新版本3.x兼容IE9+，用于开发响应式布局、移动设备优先的Web项目. 官网： http://getbootstrap.com/. UI框架的后起之秀，UI动画效果很棒，一个很有潜力的项目.

2007年W3C(万维网联盟)立项HTML5，直至2014年10月底，这个长达八年的规范终于正式封稿. 过去这些年，HTML5颠覆了PC互联网的格局，优化了移动互联网的体验，接下来，HTML5将颠覆原生App世界. 这听起来有点危言耸听，但若认真分析HTML5的发展史，你会发现，这个世界的发展趋势确实就是这样.

Web API 变得越来越丰富，其中一个值得注意的是 Web Speech API. 传统的网站只能“说”，这个API的出现，让网站能“倾听”用户. 这个功能已经开放了一系列的用法，非常棒. 在这篇文章中，我们将看一下这项技术和建议的用法，以及如何用它来增强用户体验的一些好例子. 声明：本技术比较前沿，目前该规范是W3C的“非官方编辑器的征求意见稿”（截至2014年6月6日）.

不管是浏览器的开发者还是普通web应用的开发者，他们都在做一个共同的努力：让Web浏览有更快的速度感觉. 有很多已知的技术都可以让你的网站速度变得更快：使用CSS sprites，使用图片优化工具，使用.htaccess设置页面头信息和缓存时间，JavaScript压缩，使用CDN等. 我曾经介绍过本站上使用的一些速度优化技术.

移动设备和桌面电脑上的客户端API起初并不是同步的. 最初总是移动设备上先拥有某些功能和相应的API，但慢慢的，这些API会出现在桌面电脑上. 其中一个应用接口技术就是 getUserMedia API，它能让应用开发者访问用户的摄像头或内置相机. 下面就让我展示一下如何通过浏览器来访问你的摄像头，并提取截屏图形.

最近我在研究开发一个火狐插件，具体的功能是将网页内容截屏并分享到微博上. 目前基本功能已经实现，大家可以在 @程序师视野 里看到用这个截图插件分享的微博的效果. 之前我曾写过 如何将canvas图形转换成图片和 下载canvas图像的方法，这些都是在为这个插件做技术准备. 技术路线很清晰，将网页的某个区域的内容生成图像，保持到canvas里，然后将canvas内容转换成图片，保存到本地，最后上传到微博.

之前我曾介绍过如何将HTML5 画布(canvas)内容转变成图片形式，方法十分简单. 但后来我发现只将canvas内容转变成图片输出还不够，如何能将转变后的图片保存到本地呢. 其实，这个方法也是非常简单的，几乎不用额外的编程知识. 但我们可以更完美些，下面我将使用 canvas2image.js, base64.js这两个脚本实现更强大的canvas->图片->本地的过程.

你可能已经听说过，HTML5里引入了几种新的input类型. 在HTML5之前，大家熟知的input类型包括：text(输入框)，hidden(隐藏域)，submit(提交按钮)等. 而HTML5到来之后，新增的input类型包括：number(数字)，date(日期)，color(颜色)，range(范围)等等.

最近在Codepen看到Top Pens of 2013这个专题，专题内容为2013年上最优秀的前100个CSS、HTML5和Javascript Pens，在惊叹技术人员的创造力同时我们还能学习这些技术，对交互设计师而言还能获取灵感哦. Top Pens of 2013专题地址： http://codepen.io/2013/popular.