html的认识
1、html是网页描述语言，不是编程语言；
2、注释： <!--HTML注释--> // /*CSS注释*/
3、标签分类
单标签：<br/> <hr/> <img/> <input/>
双标签：<div></div> <span></span>...
4、标签的关系
并列 -- 兄弟关系
嵌套 -- 父子关系
常用标记
常用标记（80%标签是语义化标签）
h1~h6: 一到六级标题标签，h1权重最高，表示着重显示，如给logo加h1标签；
<p>段落标签</p>
<em>倾斜，表强调，有语义</em>
<i>倾斜，没有语义，外观倾斜</i>
<strong>加粗，有语义</strong>
<b>加粗，没有语义</b>
<del>删除线，有语义</del>
<s>删除线，没有语义</s>
<pre>预格式化显示</pre>
<br/>换行，单标签
<hr/>分隔符标签，单标签
图像标记
<img src="图片路径" alt=“图片未加载时的替换文本” title=“鼠标经过图片时的悬停文本”>
（1）相对路径：
图片资源与当前网页在同一目录下，src="图片名.png"
图片资源在下一级文件夹内时，src="img/图片名.png"
图片资源的文件夹与当前网页的文件夹在同一目录下，src="../img/图片名.png"
绝对路径：带有盘符（如C盘）或网址（WWW）的
（2）alt：图片未加载时显示的替换文本
title：鼠标经过图片时显示的悬停文本
width/height：10px；款高只写一个时，图片按比例缩放
align：设置文本与图像的对齐方式 bottom，top，middle
列表 ul ol dl
列表ul，ol只能嵌套li，li里边可以嵌套其他标签，注意嵌套缩进，以便检查嵌套关系。
无序列表ul：
默认li前面有小原点，可以通过list-style清除或改变样式
<ul>
<li>1</li>
<li>2</li>
</ul>
有序列表ol：
默认前面有数字，可以用list-style清除或改变样式
<ol>
<li>1</li>
<li>2</li>
</ol>
自定义列表dl：
dd默认缩进
<dl>
<dt>
<dd>1</dd>
<dd>2</dd>
</dt>
<dt>
<dd>3</dd>
<dd>4</dd>
</dt>
</dl>
超链接标签
文字链接（默认蓝色文字加下划线）：
<a href="跳转的网页链接地址" target=“/blank（在新窗口打开）” title=“鼠标悬停时提示文件”>
点击的内容 （即链接文字）
</a>
图片链接：
<a>
<img src=" 图片链接地址 "/>
</a>
锚点定位：
不跨页面的地址：
<a href="# id名">要点击的文字</a>
<p id="id名"></p >或<p><a name="id名"></a></p>(推荐使用name ，id一般用在CSS,JS中，是唯一的)
跨页面的地址：
<a href= "文件名+#id名"> <p id="id名"></p>
表格标记
表格框架
<table>-------表格 默认有边框
<caption>表格标题</caption>
<thead>--------表格头部
<tr>
<th></th>
<th></th>
<th></th>
</tr>
</thead>
<tbody>------表格主体，如果不写，默认添加
<tr> -----行
<td></td>
<td></td>
<td></td>
</tr>
<tr> -----行
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
<tfoot>---------表格尾部
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</tfoot>
表格默认样式
表格一般用来布局 ----> 更好的展示数据
th 表格表头单元格，水平垂直居中加粗
td 单元格，默认水平居左，垂直居中
表格常用属性
调整整个表格在页面中的位置： align: left/center/right
调整这个表格在竖直方向的位置： valign：top/center/bottom
调节单元格内的元素与左侧边框的距离： cellpadding： 6px; 【写成行内样式，写成属性不起效】
调节相邻单元格的边框间的距离： cellspacing: 0; 【写成行内样式，写成属性不起效】
合并单元格
跨行合并 n行 rowspan=“n”
先确定哪n个相邻列的单元格需要合并，
在要合并的第一个单元格加属性 rowspan="n"，
再把其余n-1项相应的单元格删去。
跨列合并colspan=“n”
先确定哪n个相邻行的单元格需要合并，
在要合并的第一个单元格加属性 colspan="n"，
再把其余n-1项相应的单元格删去。
表单标记
表单作用
表单用来搜集用户信息，实现人机交互。
一个完整的表单 = 表单控件（文本框 input）+ 提示信息（文本 value 或 placeholder）+ 表单域（外框form）
表单框架 ---->表单域+表单控件+提示信息
<form action="表单提交的地址"> // 快捷键： input:type
用户名： <input type="text" name="username"/> // 文本框
密 码： <input type="password" name="" placeholder=“占位文字”/> //密码框
性 别: <input type="radio" value="male" name="sex"/>男 //单选框
<input type="radio" value="famale" name="sex"/>女 //相同name值绑定同一组选项，实现排他项
爱 好: < input type="checkbox" name="hobby" checked="checked"/>A
< input type="checkbox" name="hobby"/>B
< input type="checkbox" name="hobby"/>C // 复选框
地 址： <select name="city"> //下拉列表
<option value="bj">北京</option>
<option value="bj">北京</option>
<option value="bj">北京</option>
<option value="bj">北京</option>
</select>
选择理由：<textarea name="words" cols="30" rows="10"> //文本域
文本内容
</textarea>
上传文件：<input type="file" name="resume/"> // 文件域
隐 藏：<input type="hidden" name=""/>
普通按钮: <input type="bottom" value="普通按钮"/> // 按钮
提交按钮: <input type="submit" value="提交按钮"/>
重置按钮: <input type="reset" value="重置按钮"/>
图片提交按钮: <inpue type="image" src="" alt=""/> 图片提交按钮
</form>
各属性解读
value: 控件中的默认文本 ，也可以获得用户输入值，后台需要通过该值知道你输入或选的是什么值
name: 控件名字，表示表单元素名称，用于区别表单（同一name值绑定同一组控件，使本组控件与其他组控件互斥），携带数据去后台
checked="checked"，或直接checked： 单复选框中的默认选中项
selected="selected“： 下拉列表中的默认选中项
readonly: 只读
disabled: 不能被操作，且不能被提交
表单实例（表单一般搭配table布局使用）
重新定义表单边框样式：
input{
outline-style: none; /*去掉轮廓线*/
border: 0 none; /*去掉边框*/
color: #757575; /*重新定义边框颜色*/
-webkit-appearance: none;
}
没有去掉轮廓线的文本控件，即使去掉了边框，选择输入框以后还是会出现方框，即轮廓线
密码框的提示文本一般用placeholder
lable标签（提高用户体验）
方法一：直接包含，适用于单个表单
<lable> 用户名：<input type=“”></lable>
方法二：for和id ，与锚点相似
<lable for="sex">男</lable>
<input type="radio" name="sex" id="sex">
html区块（div+span）一般用于布局
div（定义了文档的区域，块级 (block-level)）
HTML <div> 元素是块级元素，它是可用于组合其他 HTML 元素的容器。
<div> 元素没有特定的含义。除此之外，由于它属于块级元素，浏览器会在其前后显示折行。
如果与 CSS 一同使用，<div> 元素可用于对大的内容块设置样式属性。
span（用来组合文档中的行内元素， 内联元素(inline)） HTML 元素是内联元素，可用作文本的容器
<span> 元素也没有特定的含义。
当与 CSS 一同使用时，<span> 元素可用于为部分文本设置样式属性。
83
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
