对于前端的学习要先了解一下浏览器和html的发展史
其次看看这篇文章：https://kb.cnblogs.com/page/129756/#chapter1
我读到这句话时候感觉到了科技这个东西有很多时候并不是一家独大的。
而现实生活中是需要互相学习的
奇怪的是，并没有哪个正式公布的规范对用户界面做出规定，这些是多年来各浏览器厂商之间相互模仿和不断改进的结果。
HTML ?网页结构：html经过浏览器 渲染以后 展现出来的页面
??????????渲染：渲染在电脑绘图中是指用软件从模型生成图像的过程。
??????????模型：是用严格定义的语言或者数据结构对于三维物体的描述，
??????????????????它包括几何、视点、纹理以及照明信息
编码：通过代码的形式，把想要展现的页面，写在html文档中
相关的语言有html+css+javascript
html+css可以写出来网页的样式
javascript页面的行为
标签<a>一般是成对出现的 ?也有单标签<br> <br/>(可以省略)
属性：在元素中添加的 附加的信息<标签 name="value">
自定义标签
HTML 标签指示浏览器做出的相应的显示
1.html 从上到下解析
2.元素可以互相嵌套
<!DOCTYPE html>文档类型 声明用哪个版本的HTML
<html ?lang="zh">根元素 ?语言中文
<head>
配置
<title></title>网页上面标题
<meta charset="UTF-8">
</head>
<body style="css"> css的内容
网页内容
</body>
<p>段落<\p>
<h1>标题<h1>
<br>换行
&npsb；空格
文本格式化标签
<strong>
<em>斜体
<del>删除线
<span style="">
图片
<img src="路径" alt="可替换文本" title="图片上显示字">
格式：jpg 有损压缩 影响画质 小 不支持透明通道
png,无损压缩支持透明通道
gif
网络图片<img src="网络路径">
本地图片
绝对路径比如（C:sytem\s\）
相对路径 "../img/"
超链接：<a href="http//" target=“-black>
??????????????????<img src="" >跳到图片
?????????????</a>
书记标记：锚点
设置个锚点<a id="maodian">
点击跳到这个锚点 <a href="#idmaodian">
图片的映射
<body>
????<img src="图片路径" ?usemap="#01图片">
????<map name="01这张图片">
????<area shape="circle" coords="中心（X,Y），半径" href="" alt="一链接">
????<area shape="rect" coords="" href="左上方的坐标（X,Y），右下角点的坐标（X,Y）" alt="二链接">
????</map>
列表
无序列表 ul+li 无顺序关系
有序列表 ol+li 有顺序关系
自定义列表 内容标题+内容 列表 dl+dt+dd ?
<ul type="" \style="">改变前面的东西
???<li></li>
</ul>
<ol>
????<li></li>
</ol>
<dl>
??<dt><dt>
<dl> ?
</body>
表格是由若干行组成的
<body>
???????<table>表格
?????????<tr>行
?????????<th></th>标题
?????????<td></td>内容
?????????</tr> ?
</body>
porder="1"表格的边框
colspan ?单元格可横跨的列数
rowspan 单元格可横跨的行数
表单
收集 用户输入 发送或者 提交给服务器
用户输入：
文本：普通 密码
单选框
多选框
下拉框
提交：提交按钮
http 超文本传输协议 浏览器和服务器的通讯
模式：请求-应答 浏览器主动发起请求-》服务器接收-》自生做处理-》结果返回浏览器-》浏览器根据结果展示出来
GET POST -->
<from action="" ?method="GET">action提交的页面 GET放在浏览器的头里默认method不变化
??<input type="text" name="usr">用户的
??<input type="password" name="pwd">
??
单选框 性别：<input type="radio" ?name="sex" value="boy">男
???????????????????<input type="radio" ?name="sex" value="girl">女
复选框 ?兴趣: <input type="checkbox" name="" >篮球
???????????????????<input type="checkbox" name="" >足球
???<input type="checkbox" name="" >排球
下拉框 ?城市: <select name="city">
???????????????????<option value="">上海<\option>
???????????????????<option ?value="">北京<\option>
</from>
布局
<body>
???????一般来说布局是先按功能分成好多小块 排列好
??????
?????<div > 容器 ?用来装东西
?????</div>
布局div+css
table
frameset:管理后台
iframe: 嵌套页面
百度页面：<iframe src="" frameborder="0" width="100%"></iframe >
腾讯页面：<iframe src="" frameborder="0" width="100%"></iframe >
frameset:
</body>
可以实现局部刷新
??<frameset ?rows="15%,85%">和body同级标签
??<frame src=frame1.html>
<frameset ?cols="20%,80%">和body同级标签
??<frame src=frame2.html>
??<frame src=frame3.html>
??<frame src=frame1.html>
</frameset>
嵌套规则
块元素：独立成一行 可以设置宽高 默认宽高100%
{
文字类块元素：p ?h1-h5
容器类块元素：div table from ul li
}
行元素：不独立成一行,不可以设置宽高 由内容决定宽高
{ a img input strong em span del}
特殊字符：文字 br
嵌套规则
1.块元素可以嵌套行元素
eg <div ><a href=""> 块嵌套行</a></div>
2行元素可以嵌套行元素
< span ><strong>行嵌套行</ span ></strong>
3.行元素不可以嵌套块元素
4.文字类元素不可以嵌套块元素
5.容器类块元素 可以嵌套块元素
HTML新手推荐
原文地址：https://www.cnblogs.com/illusory/p/9822325.html