web前端开发 | 易学教程

web前端入门到实战：CSS的语法与工作流

阅读更多关于 web前端入门到实战：CSS的语法与工作流

本篇则主要介绍 CSS 的语法与 CSS 是如何工作的。 CSS语法 1. 基本规则 CSS 规则主要由两部分组成：选择器(selector) 与声明(declarations) 。选择器(selector) 是开发者希望改变样式的 HTML 元素。声明(declarations) 则是开发者制定的希望 HTML 改变的元素规则，可以是一条或多条。每条声明(declarations) 由一个属性(property) 和一个值(value) 组成。属性(property) 是开发者希望设置的样式属性（style attribute）。值(value) 为属性的具体内容。属性与值之间由冒号隔开，声明与声明直接由分号隔开。 CSS中的注释以 /* 开始并以 */ 结束。 /* selector {property: value} */ h1 {color:red; font-size:14px;} 上面这行代码的作用是将 h1 元素内的文字颜色定义为红色，同时将字体大小设置为 14 像素。 2. 样式表书写规则每个HTML元素都有初始的样式，但是也可以经过开发者书写而改变样式规则。 HTML 的元素样式修改有以下的书写规则。内部样式表（写在 <head> 标签内部） <!DOCTYPE html> <html> <head> <style> h1

web前端入门到实战：CSS起源

阅读更多关于 web前端入门到实战：CSS起源

HTML的诞生 HTML是怎么来的？在1982年的时候，万维网的发明者 Tim Berners-Lee 爵士为了让全世界的物理学家能够方便的进行合作与信息共享，造了 HTML(HyperText Markup Language) 超文本置标语言。在1991年3月， Tim Berners-Lee 把 HTML 介绍给了给他在 CERN(欧洲核子研究中心) 工作的朋友，当时网页浏览器被其世界各地的成员用来浏览 CERN 庞大的电话薄。然后在8年之后的1990年，博士发明了世界上第一个浏览器 WorldWideWeb ，也因此推动着互联网高速发展。在 WorldWideWeb 问世之后的1993年 NCSA 推出了 Mosaic 浏览器并且迅速火了起来，成为第一个世界级应用的浏览器，推动着互联网发展。随后跟着的有当时的两大霸主 Netscape de Netscape 浏览器与 MicroSoft 的 Internet Explorer 浏览器，这两个浏览器在当时掀起了一场互联网浏览器大战。这场战争的结果是以 Internet Explorer 全胜告终。但也因此大大的推动了互联网的发展。 CSS的诞生 CSS是怎么来的？就在承载 HTML 的浏览器迅猛发展的90年代， CSS (Cascading Style Sheet) 也应运而生。不同的浏览器结合各自 HTML

web前端开发：npm相关操作

阅读更多关于 web前端开发：npm相关操作

web前端开发：npm相关操作 npm(Node Package Manager)在安装node的时候就会自动的安装了。不同版本的node对应不同版本的npm，当系统中存在多个node时，你需要设置当前的node的版本： nvm use 6.4.0 然后就可以使用npm了.关于npm常用命令以及用法，请看下文。安装包：安装包分为全局安装和本地安装。全局安装是安装在当前node环境中，在可以在cmd中当作命令使用。而本地安装是安装在当前项目中，只有当前这个项目能使用，并且可以通过require引用。安装的方式只有-g参数的区别： npm install express # 本地安装 npm install express -g # 全局安装卸载包： npm uninstall [ package ] 更新包： npm update [ package ] 默认的npm安装目录查看和修改默认的安装路径：C:/用户/[用户名]/AppData/Roming/npm/node_meodules 查看命令： C:\Users\shenhy > npm config ls ; cli configs metrics-registry = "https://registry.npmjs.org/" scope = "" user-agent = "npm/6.12.1 node

全栈工程师之路-Node.js

阅读更多关于全栈工程师之路-Node.js

1. 全栈工程师之路-Node.js 高可用架构专用原文[高可用架构] https://mp.weixin.qq.com/s?_ biz=MzAwMDU1MTE1OQ==&mid=405001493&idx=1&sn=f0ecab9b31bad83fb065ac37bb728245&scene=1&srcid=0324iTRH12WbXL5VDxXnEhH8&key=710a5d99946419d938a0ffc16a3c72118eefbe33f3f8312ed218bccbde126b60e818c8eb1068a9b07bdc8116a077b911&ascene=0&uin=NDIzMjM3MDk1&devicetype=iMac+MacBookPro11%2C1+OSX+OSX+10.10.5+build(14F27)&version=11000006&pass ticket=xdp3crkTJPuOH6ggUMKnwvfDGKEnMUvwC5V%2FdxlW%2FKdNO9R8zI1xsDFSR4ZJECUU 仔细的对比了一遍，感谢tim yang和庆丰校长的整理，非常严谨，比我讲的要好，另外感谢霍老板封我是StuQ明星讲师[呲牙][呲牙] 1.1. 主要内容 Why Node.js ？历史槽点架构平衡和选择企业级我眼中的Node.js核心快速开发实践

全栈工程师之路-Node.js

阅读更多关于全栈工程师之路-Node.js

全栈工程师之路-Node.js 高可用架构专用原文[高可用架构] https://mp.weixin.qq.com/s?__biz=MzAwMDU1MTE1OQ==&mid=405001493&idx=1&sn=f0ecab9b31bad83fb065ac37bb728245&scene=1&srcid=0324iTRH12WbXL5VDxXnEhH8&key=710a5d99946419d938a0ffc16a3c72118eefbe33f3f8312ed218bccbde126b60e818c8eb1068a9b07bdc8116a077b911&ascene=0&uin=NDIzMjM3MDk1&devicetype=iMac+MacBookPro11%2C1+OSX+OSX+10.10.5+build(14F27)&version=11000006&pass_ticket=xdp3crkTJPuOH6ggUMKnwvfDGKEnMUvwC5V%2FdxlW%2FKdNO9R8zI1xsDFSR4ZJECUU 仔细的对比了一遍，感谢tim yang和庆丰校长的整理，非常严谨，比我讲的要好，另外感谢霍老板封我是StuQ明星讲师[呲牙][呲牙] 持续更新版本仓库地址 https://github.com/i5ting/nodejs-fullstack 在线阅读 http:/

emacs 前端插件推荐[emmet-mode]

阅读更多关于 emacs 前端插件推荐[emmet-mode]

安装篇在vim下使用emmet极大地提高了开发效率，安利下emacs下的emmet-mode emmet-mode自带的 pacakge.el 就有安装，直接体验的同学可以直接下行安装 `M-x` `package-install` `emmet-mode` 也可以在配置文件中加入(需重启一次emacs) (setq package-archives '(("elpa" . "http://tromey.com/elpa/") ("gnu" . "http://elpa.gnu.org/packages/") ("marmalade" . "http://marmalade-repo.org/packages/") ("melpa" . "http://melpa.org/packages/") )) (unless (package-install-p "emmet-mode") (package-install "emmet-mode")) 装上emmet,下面添加到我们的 js/jsx/html 以jsx为例 (add-to-list 'auto-mode-alist '("\\.jsx$" . 'emmet-mode)) 也可以作为hook的方式加入到主模式中(推荐一下web-mode，支持js/php/jsx(react)...几乎所有web开发语言) (add-to

前端简历

阅读更多关于前端简历

简历的本质在写简历之前，我们必须清楚的了解一件事情，那就是简历是什么？它不是人生履历，不是项目清单，也不是技能大放送。简历的存在只有一个目的 —— 帮你约到面试。只要能达到这个目的，简历可以是一段视频，一个开源项目，一张照片，甚至是一行字，比如： I wrote javascript 当然，绝大部分简历的形式，就是我们所熟知的，是一篇文章。即使你通过其他方式获得了面试，当你入职的时候，还是要有这么一份纸质简历的，所以不要想着偷懒。其实简历不只是表现自己，更是传递以下三个信息，增强通过率。是什么（你能做什么？，擅长什么？）比别人好在哪些地方（相比其他同行，你的优势？）如果雇佣你，招聘方会得到什么好处（能不能为企业带来效益？）正如你抉择跳槽，思考要不要留在这个公司的时候，你也可能考虑下面三点待遇（给的钱够不够？福利好不好）环境（同事nice不？老板好不好？事少离家近？工作开心与否？是否帅哥美女多？嗯哼）个人（有晋升机会不？能否再进步？）当然企业和你的相互选择其实正如上面几点中的考量和博弈，当然面试是平等的，是相互选择的结果，所以有你对企业的考量，也有企业对你的考量回归到写简历，和很多人在大学写议论文写作文是不同的，过分的论证会显得自夸，反而容易引起反感，所以要点到为止。这里的技巧是，提供论据，把论点留给阅读简历的人自己去得出。放论据要具体，最基本的是要数字化

网上面试题

阅读更多关于网上面试题

链接：https://www.zhihu.com/question/41466747/answer/91084888 1.对WEB标准以及W3C的理解与认识标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性； 2.xhtml和html有什么区别 HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言最主要的不同： XHTML 元素必须被正确地嵌套。 XHTML 元素必须被关闭。标签名必须用小写字母。 XHTML 文档必须拥有根元素。 3.Doctype? 严格模式与混杂模式-如何触发这两种模式，区分它们有何意义? 用于声明文档使用那种规范（html/Xhtml）一般为严格过度基于框架的html文档加入XMl声明可触发，解析方式更改为IE5.5 拥有IE5.5的bug 4.行内元素有哪些?块级元素有哪些?CSS的盒模型? 块级元素：div p h1 h2 h3 h4 form ul 行内元素: a b br i span input select Css盒模型:内容，border ,margin，padding 5

前端面试题（不定期更新）

阅读更多关于前端面试题（不定期更新）

本文由我收集总结了一些前端面试题，初学者阅后也要用心钻研其中的原理，重要知识需要系统学习、透彻学习，形成自己的知识链。万不可投机取巧，临时抱佛脚只求面试侥幸混过关是错误的！也是不可能的！不可能的！不可能的前端还是一个年轻的行业，新的行业标准，框架，库都不断在更新和新增，正如赫门在2015JS大会上的《前端服务化之路》主题演讲中说的一句话：“每18至24个月，前端都会难一倍”，这些变化使前端的能力更加丰富、创造的应用也会更加完美。所以关注各种前端技术，跟上快速变化的节奏，也是身为一个前端程序员必备的技能之一。目录 1.面试注意 2.HTML 2.1 Doctype作用？标准模式与兼容模式各有什区别？ 2.2 HTML5 为什么只需要写 !DOCTYPE HTML？ 2.3 行内元素有哪些？块级元素有哪些？空(void)元素有那些？ 2.4 页面导入样式时，使用link和@import有什么区别？ 2.5 介绍一下你对浏览器内核的理解？ 2.6 常见的浏览器内核有哪些？ 2.7 html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？ 2.8 简述一下你对HTML语义化的理解？ 2.9 HTML5的离线储存怎么使用，工作原理能不能解释一下？ 2.10 浏览器是怎么对HTML5的离线储存资源进行管理和加载的呢？ 2

各浏览器下图片垂直居中的方法：

阅读更多关于各浏览器下图片垂直居中的方法：

各浏览器下图片垂直居中的方法： 1.IE6下使用writing-mode：tb-rl；当writing-mode为tb-rl 时，文档流是从上到下，从右到左书写。然后设置text-align: center就可以实现垂直方向上的居中。算是一个小技巧吧。实现未知高度替换元素图片垂直居中： <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>利用定位来显示垂直局中的图片</title> <style type="text/css"> .miao { width:500px; height:220px; line-height:220px; border: 1px solid; text-align: center; } .miao img { vertical-align: middle; } </style> <!--[if IE 6]> <style type="text/css"> .miao span { border: 1px solid red; height: 100%

订阅 web前端开发