1.在html中标签可以分为单标签和双标签,顾名思义单标签是单独存在的,而双标签是成双成对出现的。除了这点不同,他们在闭合方式上也不一样。
举例说明:双标签<div></div> ; 单标签 <img src ="" alt=""/>(src 和alt 是img标签的基本属性)
目前接触到的单标签比较少,我做了以下总结:
<br/>换行标签;<img/>图片标签; <input/>输入; <hr/>分割线;<meta/> ;<link/>链接html文档和外部样式。
2.还可以按照 block(块级标签);inline(行级标签);table (表格级标签);列表标签等。
*因为表格标签及列表标签等这类标签具有块级标签的属性,所以我也把它们划分到块级标签里。
常见的块级标签:body, div, h1~h6, p, form, table,ol, ul, dl 等;块级标签的特点:可以设置宽高,margin,padding有效,border,背景有效。
行级标签:a , span , img , i ,等;行级标签的特点:纵向的margin和padding无效。
3.标签的默认属性。
body:可以设置边框和背景,边框可以设置width和height,设置背景时,背景撑满全屏,可修改内容,但不会影响背景。有默认margin:8px;
div:默认继承父级宽度,没有默认高度,内容撑开高度;
h1~h6: 默认继承父级宽度,有margin-top,和margin-bottom,字体加粗,font_weight:bold/bolder;
p : 标签有默认的margin;
ol,ul,dl : 有默认的margin,padding, list-style-type ;
table : 默认display:table;
form : 有 name,action,method,target等属性;(例:<form name="表格名称" action="url" method="get" target="-self"></form>)
4.表格标签的一些特有属性单独列出来
*表格标签比较特殊,有border-collapse。border-collapse:默认值是separate,这时单元格不合并,当border-collapse:collapse时表示相邻的两个单元格合用同一条边框;
*border-spacing: 0,0;设置相邻单元格的边框间的间距,第一个值表示左右,第二个值表示上下,可以为一个值,表示上下左右。
*vertical-align: top/middle/center; text-align: left/center/right 。
th表示行头,也就是每一行的第一个单元格,里面的内容默认是上下左右都居中的,并且有字体加粗的效果。
掌握了这些标签的基本属性我们就可以做一个reset样式重置表,方便我们使用。