学习HTML汇总

标签可以拥有属性为其提供更多的信息

元素包含标签和其内容

1.首先是一些元素的标签：

<p></p>定义段落；<a></a>插入超链接；<img>插入图片；<h></h>标题；<table></table>定义表格；表格中：

<tr></tr>定义行；<td></td>定义单元；<caption>表格标题<th>表格的头；<thead>表格页眉；<tbody>表格主体；

<tfoot>表格页脚；

列表：<ul></ul><li></li>无序列；<ol></ol><li></li>有序列；<dt></dt><dd></dd>自定义列表

<form></form>定义表单后面都省略后标签：<b>;<big>;<em>;<i>;<small>;<strong>;<sub>;<sup>;<ins>;<del>

HTML块：<div id=“divid”><p>内容</p></div>通过css改变其样式 <span></sqan>文本的容器，定义文本样式

表单：获取不同类型的用户输入：<form>;<input>输入域;<textarea>文本域;<label>控制标签;<fieldset>定义域;

<legend>域的标题;<select>选项列表;<optgroup>选项组;<option>下拉列表的选项;<button>按钮

框架：html5没用了：<frame>;<frameset>仍使用：<iframe>

HTML背景：background图片；bgcolor颜色；

HTML实体有的不能显示的如<>,可以搜索找到它的定义单词。

vidio:视频；audio:音频；canvas：画布

article：独立完整的内容如文章，评论，独立的插件

section：对于页面上的内容进行分块，通常由标题、内容组成

nav：导航元素，可以放链接

aside：页面或文章的附属信息，如页面广告单元，侧边栏，文章名词解释。

time：时间，属性datetime。pubdate属性：用在time元素中代表发行日期

header：整个页面或页面区域块的标题，也可包含表格，表单，图片

footer：上层父级或者根级区域块的脚注

hgroup：将标题及其子标题进行分组。例如给广告文章加的子标题

address：呈现跟文档相关的联系人的所有联系信息，呈现电子邮箱或真实地址

 

2.属性

href;src;aligh;height;width;bgcolor;target在何处打开链接;class规定元素类名；submit提交；id;style;alt图片替换文本属性；name：创建文档内连接；

表格属性：border表格边框；cellpadding单元格边距；cellspacing单元格间距；

列表属性：无序：disc，circle;square;有序：a,A,I,i,1,start，

边框：rows横向摆放；cols纵向拜访；frameborder定义框架边框

表单：radio:单选；checkbox：多选；

form:为元素指定form属性，属性值是它的id，获得用户输入是可以通过它的id得到从属关系；

formaction:在提交按钮中增加不同的formaction属性，可以让不同的按钮跳转不同页面

formmethod：对每个表单元素指定不同的提交方法：get：不安全，可以显示信息，一般淘宝商品会用

post：比较安全，没有get显示那些详细信息

formenctype:对表单元素指定不同的编码方式：1."text/plain"2."multipart/form-date"

3.application/x-www-form-urlencoded"

formtarget:对多个按钮指定在何处打开加载页面

autofocus：为文本框、选择框、按钮控件加上其属性，使其自动获得光标焦点

require：提交时元素内容为空白不准提交，用在输入元素上

placeholder：文本框未输入状态时的提示，模糊显示提示文字

list：其属性的值是datelist的id。datelist：相当于表单中的select选项列表，不过他创建的框架可以输入也可以选择。各个浏览器不同的兼容模式使得他最好自己设置style=“display：none”

autocomplete:帮助输入所用的自动完成功能

pattern：将属性值设置为某个格式，提交时会进行检查其是否符合给定格式

selectionDirection：用户正选文字，属性值为“backward”逆选：“forward”

image：表单中类型为image的inpu元素。

 

 

全局属性：contenteditable属性：使元素可编辑；designMode：整个页面是否可编辑

hidden：使元素变为不可见状态；spellcheck：对输入内容进行语法检查

tabindex:敲击tab使控件获得焦点，可设置访问数据

 

3.样式

外部样式：<link rel="stylesheet" type="text/css" href="地址">

内部样式：<style type="text/css">

body{

background-color:red

}

</style>

内联样式

<p style="color:red">

4.布局

div布局：style的body中：margin定义布局中是否充满屏幕也就是外边距；float：left同一层次从左到右；clear:both清楚浮点

table布局：在body中设置marginheight，marginwidth;colspan合并单元格