web前端
Internet：是一个全球性的计算机互联网络，中文名称“因特网”、“国际互联网”、“网际网”等等；
Internet提供的服务：http、ftp、Telnet、email、www、bbs等等；
基本实现技术：分组交换原理--信息在Internet上被分成许多的小数据包（分组）进行传输，到达目的地后将数据包组装成信息； TCP/IP协议簇
Web和Internet的关系：web是运行在Internet上最流行的应用之一，Internet为web提供了网络环境； 因为web的出现，从而极大地推动了Internet的普及与推广；
web的优势：传输快、成本低、用户多、方便易用、形式多样、便于反馈...... web的劣势：虚假信息、病毒、网瘾、数据丢失......
web：称为万维网或环球网，www（world wide web），上世纪90年代由欧洲核子研究中心的Bener.Lee，1992年正式上网； 把各类信息和服务无缝连接，提供生动的图形用户界面； 信息--文字、图片、视频、音频... 服务--Telnet、email、ftp...... 万维网就是无数文档的集合，驻留在因特网的某个地方
web的工作原理： 基于浏览器/服务器；由web服务器、浏览器和通信协议三部分组成； 通信协议采用的是http协议：超文本传输协议（hypertext transfer protocol） 通过浏览器发送请求到服务器，服务器响应请求将数据发送到请求的浏览器，中间的过程是通过http协议执行；
开发人员共具： F12；右键--审查元素（检查）
在web主要以网页的形式来发布多媒体信息； 网页采用超文本标记语言HTML（hypertext markup language）编写； 编辑--记事本、word、editplus、hbuilder、dw、sublime text、webstrom......
web服务器： 存储web页面上的信息，并提供管理环境；响应浏览器的请求，执行服务器端的程序；
主要的web服务器产品： Tomcat、Apache、IIS
web浏览器： 提交请求；解析HTML和内嵌脚本（js）；用图形化的方式显示HTML文档；
主流的浏览器： IE、firefox、chrome、opera、safari
服务器端技术：php、jsp、asp（asp.net）
前端技术（客户端技术）： HTML、CSS、JS(JavaScript)；
web是一个超文本文件的集合；超文本文件即是网页/HTML文档；通常是以.html或.htm为后缀的文档
什么是HTML： 超文本标记语言，一种纯文本类型的语言；使用带“尖括号”的“标记”将网页中的内容标识出来；
标记语法： HTML用于描述功能的符号称为“标记”； 标记在使用时必须用“尖括号”括起来；
封闭标记： 封闭标记又叫双标记，必须成对出现；<标记>内容</标记>；
非封闭标记： 又叫空标记或者单标记；<标记 /> 或者 <标记>
Xhtml于2000年1月成为W3C标准；Xhtml是更严格更纯净的HTML版本；
HTML文档结构： 1、声明--文档类型声明；声明必须写在文档的最开始部分； 2、页面/文档--<html></html> 3、页面头部--<head></head>主要装载页面的信息； 4、页面主体--<body></body> <!DOCTYPE html> <html> <head></head> <body></body> </html>
文档标题：<title></title>给页面起一个名字；
每一个标签都有属性，属性可以是一个或者多个，多个属性之间用空格隔开； 属性的组成：属性名=“属性值”； 属性必须写在开始标记内部；
HTML注释：只有程序员自己看得见，而不会再网页中显示的内容； <!--注释内容--> 注释内容中一定不要存在-- <!--fjlwaijf--waefwefa-->
再HTML页面中无论敲多少空格，都只会显示一个空格； 要想有多个空格，必须使用转义字符； 转义字符： 空格-- 左尖括号<--< 右尖括号>--> 版权©--© 注册商标--®
换行标记：<br />
强制不换行标记：<nobr>不换行内容</nobr>
标题标记：<hn></hn> n=1,2,3,4,5,6
段落标记：<p></p>
文本样式标签： <b></b>文本加粗； <i></i>文本倾斜； <u></u>添加下划线； <s></s>添加删除线； 以上标签全部不推荐使用，已经被废弃； <strong></strong>强调文本，表现为文本加粗； <em></em>强调文本，表现为文本倾斜； <sup></sup>上标标记； <sub></sub>下标标记；
标签分类： 块级标签：默认情况下，块级标签回独占一行，元素的前后内容都会自动换行； <hn></hn>、<p></p> 行内标签：不会换行，可以和其他行内元素位于同一行； b、i、u、s、strong、em、sup、sub
分区标签： <div></div> <span></span>
预格式化标签： <pre></pre> 写在该标签内的内容会按照编写时的格式展示在网页中；
页面属性： 背景颜色--bgcolor; 页面文本颜色--text;
字体标签： <font></font> 字体颜色--color； 字体--face； 字体大小--size；最小1，最大7； 该标签已被废弃；
目录结构： 一个项目（web站点）下的所有文件所在的位置；一个web站点包含多个目录，每个目录包含站点的不同部分；web站点的主目录称为根目录；位于根目录下的其他文件夹称为子目录；每个子目录都会包含具体功能的下一级子目录；
所有的文件命名必须是英文、数字、下划线（_）和连接线(-)组成；
URL： uniform resource location 统一资源定位器； 用来标识网络中的任何资源 即路径，指从当前位置到目标位置所经过的路线；
URL分类： 1、绝对路径：192.168.101.111 http:// www.baidu.com /images /img01.jpg 协议名 主机名 目录路径 文件名 用于指向其他设备上的文件； 2、相对路径: 指目标文件的位置是相对于当前文件的位置； 目标文件和当前文件在同一个目录下，直接写文件名--img01.jpg 目标文件所在的文件夹和当前文件在同一个目录下--文件夹名/文件名 images/img01.jpg 目标文件和当前文件不在同一目录下，用../表示返回上一级目录，一个../表示返回一级 ../images/img01.jpg ../../images/img01.jpg 3、根相对路径： 用于服务器
水平居中标签： <center></center> 该标签已被废弃；
标签的对齐属性： align="left" align="right" align="center"
水平分割线标签：<hr /> 宽度--width，最好带上单位px 高度--size，不用带单位 对齐--align 颜色--color
图像标签：<img /> 链接图像地址--src="路径"； 宽度--width，只给宽度表示定宽，高度自动等比变化； 高度--height，只给高度表示定高，宽度自动等比变化； title--鼠标移入后的提示文字，用于描述图片； alt--当图片无法正常显示时所用的替代文字；
超链接标签：<a></a> 链接属性--href="路径" 空链接：1、href="#",会有返回顶部的效果； 2、href="javascript:;" 图片：href="图片路径"，可以将链接指向一张图片； 压缩包：href="XXX.rar",指向一个压缩包，点击之后会下载； 发邮件：href="mailto:邮箱地址"，可以给该邮箱发送邮件； target--链接打开的目标位置； target="_blank",在新窗口打开链接； target="_self",在当前页面打开链接； 锚点名称--name，标记，可以将链接指向该标记，以达到跳转到页面指定位置的效果；
表格标签：<table></table> 表格--背景色：bgcolor 边框：border 宽度：width 高度：height 边框色：bordercolor 边框深色：bordercolordark（废弃） 边框浅色：bordercolorlight（废弃） 单元格间距：cellspacing，不用带单位 内边距：cellpadding，要带单位 对齐：align 单元行--高度：height，百分比 水平对齐：align；left、center、right 垂直对齐：valign；top、middle、bottom 单元格--宽度：width，百分比 水平对齐：align；left、center、right 垂直对齐：valign；top、middle、bottom 跨行：rowspan 跨列：colspan
表格分区： <thead></thead>:划分出表格的头部 <tbody></tbody>:划分出表格的主体 <tfoot></tfoot>:划分出表格的底部
表格标题：<caption></caption> 为表格定义一个标题，默认在表格外的最上方水平居中显示； caption必须位于table的正下方，紧挨着table；
表头：<th></th> 不能包含td，表头只能包含在tr中，默认表头内的文字居中显示并加粗；
表单： 用于显示、收集信息，并提交信息到服务器； 组成部分： 1、实现数据交互的可见的用户界面，比如：文本框、提交等； 2、提交后的表单处理； 使用<form></form>标记创建表单；在该标记中添加其他表单可以包含的控件；
<input />：用于收集用户信息； 类型--type：text文本类型； password密码类型 radio单选类型 checkbox多选类型 submit提交按钮 reset重置按钮 button普通按钮 输入框（文本类型和密码类型）--name设置输入框提交后对应的信息的名称 value一般是用于设置提示信息，也可以用于填写的信息的收集 maxlength限制输入的最大字符长度 readonly设置为“只读” required设置为“必填” disabled设置为“禁用”
单选和多选--name设置选项组的名称，单选的name必须一样，多选的name可以不同（最好相同） value确认和收集选项信息，提交到服务器 checked设置默认选择项
按钮--value设置按钮的文本 name设置按钮名称
<label></label>:将文本于控件联系在一起，点击文本就可以触发控件； for=“控件的id”就可以和控件绑定；
选项框：<select></select> name--设置选项框的名称 size--设置显示的选项数目，大于1则变为滚动列表 multiple--设置多选，按住Ctrl多选 选项：<option></option> value--确认和收集选项的信息，提交到服务器 selected--设置默认选项
多行文本框：<textarea></textarea> name--设置名称 cols--设置内容的列数，相当于设置了宽度 rows--设置内容的行数，相当于设置了高度 readonly--只读 required--必填 disabled--禁用
input其他类型：email--邮箱类型，输入错误的邮箱地址，提交时会报错，只会检测有没有“@”；
form表单属性： enctype：指定表单的数据类型（数据进行编码的方式） method：指定表单数据提交的方式； get--将数据附加在地址中提交；最大缺点是缺乏安全性、上传的信息不完全；优点是数据的传输速度快； post--将数据打包提交到服务器；安全性非常好、数据传输完整；传输速度相对较慢； action：定义表单提交时发生的动作，包含服务器脚本的URL（jsp、php...）
控件分组：<fieldset></fieldset>为控件分组 <legend></legend>为分组指定标题
有序列表：<ol></ol> 列表项：<li></li> 代码：<ol> <li></li> </ol> 属性--type：1，数字类型； a，小写字母类型； A，大写字母类型； i，小写罗马数字类型； I，大写罗马数字类型； start：设置序列号的起始；
无序列表：<ul></ul> 列表项：<li></li> 属性--type：disc实心圆（默认）； circle空心圆（圆圈）； square实心举行；
定义列表：<dl></dl>用于给出一类实物的定义，如：名词解释、解释说明、字典等等 <dt></dt>指定一个名词或术语 <dd></dd>对dt当中的内容进行解释说明 dt下面的dd是对该dt的解释说明，一个dt下面可以有多个dd；一个dl中可以有多个dt；
结构标记 <header></header>用于定义页面头部或者某一个区域的头部 <nav></nav>用于定义页面的导航信息 <section></section>定义某一个区域的主体 <article></article>用于定义某一篇文章、博客、论坛帖子等等 <article> <h1></h1> <p></p> <img /> </article> <footer></footer>定义页面的底部或者某一个区域的底部 <aside></aside>定义页面的额外信息，比如：侧边栏、广告栏等等
摘要与细节 <details></details>用于定义细节 <summary></summary>用于定义细节的标题
度量标记： <meter></meter> value设置电量的值 min设置最小取值范围 max设置最大取值范围
文本高亮显示标记： <mark></mark>