前端开发之入门到入门

作为非计算机专业的学生，学习前端着实让人头大。
J友：“学个锤子你学，走！耍起！”
萌新：“摊手”
【萌新上路，如有错误，还请不要打脸！屁股可以考虑】

HTML、XML、XHTML有啥子区别？

首先，刚开始接触的时候这三种语言给我的感觉很混乱！

• HTML（超文本标记语言），这是一个不严谨的语言，允许或安全的忽略许多技术上的非法构造，松散的 很。

• XML（可扩展标记语言），W3C的推荐标准，设计宗旨是传输数据，而并非显示数据，可以自行定义标签 哒！（听起来很酷的样子）但仅仅纯文本。
• XHTML（可扩展超文本标记语言），更严谨更纯净的HTML版本，目的是取代HTML（吃鲸）！

啷个决定我的文档是HTML还是XHTML？

XHTML视为HTML的取代者，这会是故事的结局吗？

我啷个晓得嘛！

控制文档是哪种语言的唯一事情是MIME类型，如果文档以text/html 的MIME类型提供，则将视为HTML。如果类型为application/xhtml+xml或text/xml它被视为XHTML。

我就老老实实写HTML喽！

HTML语义化？

语义化的含义就是用正确的标签做正确的事情，html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；在没有样式CCS情况下也以一种文档格式显示，并且是容易阅读的。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，有利于SEO；使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。
面试很容易问到的问题？肯定很难
大神：不存在的

易混淆的标签

标签	效果
< i >	因为某种原因和正常文本不同的文本，如专业术语、外语短语。表现为斜体
< em >	em表示强调的文本。视觉上也是斜体
	加粗的形式展现，表示文本很重要，强调
< b >	表现为粗体，但本身没有特殊的重要性和相关性
	表现高亮文本

内容、样式、行为分离

web开发中，内容样式行为分离，顾名思义是指内容属于HTML，样式属于CSS，行为属于JavaScript，需要分离开来。有什么好处呐？

• 页面载入更快
• 修改更高效
• 保持视觉一致
• 更好的被搜索引擎收录
• 对浏览者和浏览器更亲和

有哪些常用的meta标签？

标签	含义
	声明文档使用的字符编码
	声明文档兼容模式，指示IE以目前可用的最高模式显示内容
	定义针对搜索引擎的关键词
	页面描述，告诉搜索引擎你的站点的主要内容
	定义网页作者
	定义页面的最新版本
	5秒刷新一次页面
>	用于设定网页的到期时间，一旦过期则必须到服务器上重新调用。需要注意的是必须使用GMT时间格式
>	禁用缓存
	cookie设定，如果网页过期，存盘的cookie将被删除。需要注意的也必须使用GMT时间格式。
	文档宽度与设备宽度保持1:1，并且不允许手动放大缩小
	开启web app程序支持
	iPhone会自动把你这个文字加链接样式、并且点击这个数字还会自动拨号！这里忽略了数字识别为电话号码
	是否启动webapp功能 设置为yes 网站就会在满屏模式full-screen mode删除默认的苹果工具栏和菜单栏
	控制状态栏显示样式 default（白色）black（黑色） black-translucent（灰色半透明）

文档声明作用？的作用？

• 声明文档的解析类型(document.compatMode)，避免浏览器的怪异模式

• 声明不是 HTML 标签；它是指示 web 浏览器关于页面使用哪个 HTML 版本进行编写的指令。
• 在 HTML 4.01 中， 声明引用 DTD，因为 HTML 4.01 基于 SGML。DTD 规定了标记语言的规则，这样浏览器才能正确地呈现内容。
• HTML5 不基于 SGML，所以不需要引用 DT。
• 页面添加了那么，那么就等同于开启了标准模式。

严格（标准）模式和混杂（兼容）模式指什么？

• 标准模式中，浏览器以其支持的最高标准呈现页面

• 在混杂模式中，页面以一种比较宽松的向后兼容的方式显示。混杂模式通常模拟老式浏览器的行为以防止老站点无法工作。

浏览器乱码原因是什么？如何解决？

乱码原因：

• 编辑器保存文档使用的字符集与浏览器解析HTML文档使用的字符集不同，那么除英文以外文字会出现乱码。
• 浏览器解析HTML文档使用字符集依赖于HTML文档中指定的字符。
• HTML文档没有指定字符呐？那么浏览器会猜。很可能回猜对哦！

解决：

• HTML 文档一定要指定字符集为utf-8
• 编辑器保存文档使用的字符集一定要跟 HTML 文档指定的字符集匹配

常见的浏览器有哪些，什么内核？

• Trident内核代表产品Internet Explorer，又称其为IE内核。

• Gecko内核代表作品Mozilla FirefoxGecko是一套开放源代码的、以C++编写的网页排版引擎。
• WebKit内核代表作品Safari、Chromewebkit 是一个开源项目，包含了来自KDE项目和苹果公司的一些组件，主要用于Mac OS系统，它的特点在于源码结构清晰、渲染速度极快。缺点是对网页代码的兼容性不高，导致一些编写不标准的网页无法正常显示。主要代表作品有Safari和Google的浏览器Chrome。
• Presto内核代表作品OperaPresto是由Opera Software开发的浏览器排版引擎，供Opera 7.0及以上使用。

列出常见的标签，用在什么场景?

标签	场景
	定义文档的头部，它是所有头部元素的容器
	定义文档的主体
< h1>~< h6>	定义标题，拥有确切的语义
< p >	定义段落
	换行
	定义文档中的分区或节，把文档分割为独立的、不同的部分
< ul >	定义无序列表
< ol >>	定义有序列表
	用于为用户输入创建 HTML 表单，向服务器传输数据
< img >	向网页中嵌入一幅图像

【萌新上路，如有错误，还望指出，后会有期】