初学者Html——知识点总结（标签、元素、表单）

知识点一：标签

1、单标签
br、hr、img、input、link、meta、source…
2、双标签
h1~h6,p,div,span,a,b,i,u,del,s,sup,sub,em,strong,ul,ol,li,dl,dt,dd,table,tr,td,th,form,button,header,nav,footer,section,aside,article,video,audio…

知识点二：元素

元素分为块级元素和行内元素。
块级元素和行内元素的区别：
1）块级元素独占一行，行内元素在同一行显示
2）块级元素默认宽度为100%，行内元素默认宽度由内容撑开
3）块级元素可以设置宽高，行内元素设置宽高不生效，若想要其生效，需将其转换为块级元素:display:block/inline-block;方可生效
4）块级元素可以margin和padding的四周，行内元素只能设置margin和padding的左右
5）布局时，块级元素可以包含块级元素和行内元素，行内元素一般不要包含块级元素
6）块级元素默认display:block;行内元素默认display:inline;
7）块级元素
div,hn,p,ul,ol,li,dl,dt,dd,table,tr,td,th,form,header,nav,footer,section,aside,article…
8）行内元素
a,span,img,video,audio,b,i,u,s,del,sup,sub,em,strong,input,button…

知识点三：表单

1、作用：提交数据，是页面具有交互性。
2、标签：
注意：
get和post的区别：
①get提交数据不安全，post安全
②get提交数据大小有限制，post理论上没有限制
3、表单元素

<input type="text"/>		//单行文本框
<input type="password"/>    //密码框
<input type="radio" name=""/>  //单选按钮 
<input type="checkbox"/>      //多选按钮
<input type="submit"/>       //提交按钮
<input type="reset"/>         //重置按钮
<input type="button"/>       //普通按钮
<button>提交</button>       
<button type="reset">重置</button>
<button type="button">按钮</button>

<!--了解-->
<input type="file"/>
<input type="hidden"/>
<input type="image" src=""/>
<select name="" id="">		//下拉列表
    <option value=""></option>		//输入下拉列表中的内容
    <option value=""></option>
    <option value=""></option>
    <option value=""></option>
</select>
<select name="" id="">
    <optgroup label="组名">    
        <option value=""></option>
        <option value=""></option>
        <option value=""></option>
        <option value=""></option>
    </optgroup>
</select>
<textarea name="" id="" cols="30" rows="10"></textarea>	//复选框
<label for=""></label>
<fieldset>
    <legend></legend>
</fieldset>

4、属性
value 当前值
name 名称
checked 默认被选中，配合单选按钮和多选按钮使用
selected 默认显示，配合option使用
readonly 只读
disabled 禁用
placeholder="" 默认提示
required 必填项
autofocus 自动获取焦点
multiple 可以输入多个，用逗号隔开，一般配合邮箱和网址使用
min和max 最小值和最大值，配合数字和范围使用
minlength和maxlength 最小长度和最大长度
5、HTML5新增type类型（了解）

<input type="email" />
<input type="url"/>
<input type="search"/>
<input type="color"/>
<input type="number"/>
<input type="range"/>
<input type="tel"/>
<input type="date"/>
<input type="week"/>
<input type="month"/>