元素标签

 

H5新增标签:
article: 标签定义外部的内容。
aside:标签定义 article 以外的内容。a
audio:h5新增音频标签。没有高宽属性。
canvas:h5新增画布标签。
command: 定义命令按钮(未测试)
datalist:标签定义选项列表。
datalist 及其选项不会被想显示出来,它仅仅是合法的输入值列表。
details:标签用于描述文档或文档某个部分的细节。
figure:标签用于对元素进行组合。
figcaption:定义 figure 元素的标题。
footer:定义 section 或 document 的页脚。
header:定义 section 或 document 的页眉。
hgroup:用于对网页或区段(section)的标题进行组合。
keygen:标签规定用于表单的密钥对生成器字段
mark:标签定义带有记号的文本。
meter:通过min="0" max="20"的方式定义度量衡。仅用于已知最大和最小值的度量。
nav:定义document或section或article的导航。
output:定义不同的输出类型,比如脚本。
progress:定义任何类型的任务的进度。
rp:定义若浏览器不支持 ruby 元素显示的内容
rt:定义 ruby 注释的解释
ruby:定义 ruby 注释
section:标签定义文档中的节、区段。比如章节、页眉、页脚或文档中的其他部分。
source:audio和video的属性之一。为audio和video定义媒介源。
summary:为details定义标题。
time:定义日期或时间。
video:h5新增视频标签。具有高宽属性。
 

自闭合标签<img/>
<input><img/><br/><link/><hr/>等

块级元素   p  ul  hr  li  div  form   

行内块元素   input  img  button

内联元素   span  a
1.块级元素
2.行内元素
3.块级元素与行内元素的区别
(1)块级元素会独占一行,其宽度自动填满其父元素宽度;
行内元素不会独占一行,相邻的行内元素会排列在同一行,直至一行排不下才会换行,其宽度随元素的内容而变化。
(2)块级元素可以包含行内元素和块级元素;行内元素不能包含块级元素。
(3)行内元素设置width、height、margin-top、margin-bottom、padding-top、padding-bottom无效。
4. 块级元素与行内元素的转换
display:inline-block;
display:inline;
display:block;
5.可变元素
 
 

块元素,行内元素,行内块区别

块元素
  例如:div,p,ul,dl,ol,li,dd,dt,h1~h6
  特点:独占一行,可以设置宽高,可以设置margin,padding,默认情况下宽度=父级元素的宽度
  转换成行内 display:inline

******************************************************************************************

行内元素
  例如:a,span,i,em,strong,b,label
  特点:不会独占一行,与相邻的【行内元素】会排在同一行,不能设置宽高,宽高根据内容自动撑开
     行内元素水平方向的margin-left; margin-right; padding-left; padding-right;可以生效。
       但是竖直方向的margin-bottom; margin-top; padding-top; padding-bottom;却不能生效。
  转换成块display:block

*******************************************************************************************

行内块

 例如:input,img,select

 特点:不会独占一行,与相邻的【行内元素】或者【行内块元素】会排在同一行,可以设置宽高,不设置宽高时按内容自动撑开

   可以设置margin,padding,

转换成行内 display:inline

 转换成块 display:block

posted @ 2017-03-09 11:36  我啊我  阅读(149)  评论(0编辑  收藏  举报