web前端开发小结
1.浏览器内核
IE-----Trident
Edge-----EdgeHTML
Firefox-----Gecko
Safari-----Webkit
Chrome-----Blink(Webkit分支)。
2.文档流/网页流(正确理解为普通流)
稳定性:标准流〉浮动流〉 定位流 (优先用标准流)。
3.网页宽度
pc:一般是950-1200px(具体问题具体分析,看需求来定,不同类型网站,会有不同宽度)。
mobile:一般以苹果手机iphone5(640x1136px)为基准。(暂不考虑平板电脑,以苹果移动端的尺寸来兼容android移动端的尺寸,难怪那么多人买iphone手机,移动网页以iphone为基础。)
PS:系统分辨率占有率
网页宽度与首屏高度
4.相对路径与绝对路径
"."--代表目前所在的目录。
".."--代表上一层目录。
"/"--代表根目录。
PS:开发的时候使用相对路径。
发布的时候使用绝对路径。
原因:确保路径指向文件的唯一性。
5.xhtml与html4(其实我们一般是使用xhtml规范,而不是html4规范)
xhtml必须要小写。
xhtml必须要严格嵌套标签,<b><i></i></b>。
xhtml必须要标签成对出现,<b></b>。
xhtml必须要属性值加双引号。
xhtml必须要区分结构标签与内容标签 <p>是内容标签,<table>是结构标签,不允许<p>包含与<table>标签。
6.css放在头部,js文件在尾部
PS:js代码不一定都放在底部,有些需要在头部。
比如某些元素有load事件。
7.css必要时写在页面(不是内联css)
PS:分布式部署一些网页的文件的时候(即文件不是放在同一台服务器上)需要把css写在页面里面,不使用<link>,而使用<style></style>,以防网页外部的链接失效而造成纯文字。
8.css与js需要加版本号
解决缓存更新问题。(建议工具生成版本号)
PS:版本号添加方式
方式一:<link rel="stylesheet" href=“main.css?v=xxx">
方式二:<link rel="stylesheet" href=“main.xxx.css">
建议采用方式二,原因是方式一在某些代理缓存服务器带参数上不起作用。主流的webpack打包工具都是采用方式二。
9.网页编码
一律使用utf-8,为了兼容。
10.网页语言
国际化的网站需要设置一下语言<html lang="zh-CN"> (不一定国际化的时候,设置可以利于seo优化,告诉浏览器语言设置)
11.WEB安全色
注意网页的安全色,安全色有216种色(详细请百度),为了兼容。(这就是为什么mac平台与windows平台看同一张图片显示效果差别大的原因)
12.IE兼容 (看看就好了)
html部分
w3c盒子宽度指内容宽度,不计内边距、外边距、边框。
IE盒子宽度包含内边距与边框。
css部分
.mycolor{
color:#FFF\9;/*IE6、7、8*/
*color:#FF0;/* IE7、6 */
_color:#F00;/* IE6 */
}
13.CommonJS、Promises/A、UMD、AMD与CMD规范
CommonJS:不局限于浏览器的js模块化规范,如:服务端运行。
Promises/A:异步编程模式的一个结果,指then方法返回成功或失败的结果规范。
UMD:通用模块定义,AMD与CommonJS结合,指前后端跨平台。
AMD:异步模块定义,指js模块提前加载,主要应用于前端。(预加载)
CMD:普通用模块定义,指js模块按需加载,主要应用于前端。(懒加载,国内seajs提出的一种规范,国外没有这种说法,简单理解为AMD的一种变种)
web前端开发小结的更多相关文章
- 移动web前端开发小结
注意:Chrome模拟手机的显示的界面是有误差的,强烈建议一定要在真机测试自己的移动端页面(以移动端页面为准). 1.页面高度渲染错误,页面的高度是否包含了导航,(华为手机就是偏偏有底部菜单) 设置窗 ...
- 小白入门Web前端开发学习一周小结
说之前还是先说点其他的,简单介绍下自己为何选择web前端开发: 本人之前在一家国企单位从事质检工作,干了3年,工资和待遇还算不错,但由于其工作的流动性导致知识的脱轨以及精神上的空缺,最后还是打算在25 ...
- web前端开发最佳实践笔记
一.文章开篇 由于最近也比较忙,一方面是忙着公司的事情,另外一方面也是忙着看书和学习,所以没有时间来和大家一起分享知识,现在好了,终于回归博客园的大家庭了,今天我打算来分享一下关于<web前端开 ...
- [读书笔记] Web 前端开发修炼之道
原创地址:http://www.cnblogs.com/bnbqian/p/3735565.html 转载请注明出处 今天我们要读的书是Web 前端开发修炼之道 第1章 从网站重构说起 1.1 糟糕的 ...
- Web前端开发推荐阅读书籍、学习课程下载
转自http://www.xuanfengge.com/fe-books.html 前言 学校里没有前端的课程,那如何学习JavaScript,又如何使自己成为一个合格的前端工程师呢? 除了在项目中学 ...
- 浅谈web前端开发
我个人认为前端攻城狮其实就是编程技术人员,用一句话来形容“比UI设计懂技术,比技术人员更懂交互”,当然也有人说前端工程师是工程师中的设计师,是设计师中的工程师. 好了废话不多说了,下面进入正题吧! ...
- Web前端开发工程师课程大纲
PHP程序员雷雪松整理出来的一套独一无二的Web前端开发课程.本套Web前端开发课程专门为想励志成为优秀web前端工程师的学习者而总结归纳的,本套Web前端课程舍弃了一些不常用的即将废弃的HTML标签 ...
- Web前端开发工程师需要掌握哪些核心技能?
Web前端开发所涉及的内容主要包括W3C标准中的结构.行为和表现,那么这三项中我们需要掌握的核心技能是什么呢? 1.开发语言 HTML发展历史有二十多年,历经多次版本更新,HTML5和CSS3的出现又 ...
- web前端开发分享-目录
1. web前端开发分享-css,js入门篇 2. web前端开发分享-css,js进阶篇 3. web前端开发分享-css,js提高篇 4. web前端开发分享-css,js工具篇 5. web前端 ...
随机推荐
- Python使用selenium进行爬虫(一)
JAVA爬虫框架很多,类似JSOUP,WEBLOGIC之类的爬虫框架都十分好用,个人认为爬虫的大致思路就是: 1.挑选需求爬的URL地址,将其放入需求网络爬虫的队列,也可以把爬到的符合一定需求的地址放 ...
- android中常见的设计模式有哪些?
建造者模式 建造者模式最明显的标志就是Build类,而在Android中最常用的就是Dialog的构建,Notification的构建也是标准的建造者模式. 建造者模式很好理解,如果一个类的构造需要很 ...
- linux命令之文本查看
vi掌握练习: 英文文档,相同的单词复制粘贴光标移动编辑等操作: cat:显示文件所有内容,小文件查看时使用. 缺点:文件大时不方便查看,文件很大时,会抢占系统资源,会出现命令崩溃. [zyj@loc ...
- HDU 1847 Good Luck in CET-4 Everybody! 四级好运!(博弈)
思路:先用P/N状态来找规律. N状态:1 2 4 6 8 16 P状态:3 5 因为3=1+2, 无论拿1或者2皆输.看看5,只要抽掉2就变成了3,所以是N状态.看看6,可以抽掉1 2 4,若抽1, ...
- 新萝卜家园GHOST WIN7系统32,64位官方版下载
来自系统妈:http://www.xitongma.com 新萝卜家园GHOST win7系统64位官方经典版 V2016年3月 系统概述 新萝卜家园ghost win7系统64位官方经典版加快“网上 ...
- Codeforces 666E Forensic Examination SAM or SA+线段树合并
E. Forensic Examination http://codeforces.com/problemset/problem/666/E 题目大意:给模式串S以及m个特殊串,q个询问,询问S的子串 ...
- .net代码获取节点以及读取属性
获取配置文件的节点,可以使用System.Configuration.ConfigurationManager.GetSection方法获取指定的节点,以sessionstate节点为例,如果需要获取 ...
- CF Gym 100637J Superfactorial numeral system (构造)
题意:给一个式子,ak,k>2时,0<=ak<k:ai都是整数,给你p,q让你求一组ak. 题解:构造,每次除掉q取整得到ai,然后减一减 #include<cstdio> ...
- CentOS为用户增加root权限
1.修改 /etc/sudoers vi /etc/sudoers 在下边增加一行内容 root ALL=(ALL) ALLusername ALL=(ALL) ALL 2. ...
- OO作业第一单元总结
一.第一单元作业回顾 系列一作业分为三周进行,都是表达式求导,难度渐进. 第一次实现的是简单幂函数的求导,第二次加入了sin和cos两种三角函数,第三次实现了三角函数内的嵌套以及引入了表达式因 ...