html中标签元素的三种类型 |
您所在的位置:网站首页 › html中标签的类型 › html中标签元素的三种类型 |
一、html的标签元素可以分为3类:块状元素(块元素)行内元素(内联元素)行内块状元素(可变元素) 1、块状元素: 块级元素是指本身属性为display:block;的元素。因为它自身的特点,我们通常使用块级元素来进行大布局(大结构)的搭建。 布局上:独占一行,可以容纳内联元素和其他块元素 样式上:设置width、height有效,可以设置盒子模型的相关css属性, 在不设置宽度的情况下,块级元素的宽度是它父级元素内容的宽度 在不设置高度的情况下,块级元素的高度是它本身内容的高度 常见块级元素2、行内元素: 内联元素是指本身属性为display:inline;的元素。因为它自身的特点,我们通常使用块级元素来进行文字、小图标(小结构)的应用。 布局上:和其他元素从左到右在一行排列,只能容纳文本或者其他内联元素(不要在内联元素中嵌套块级元素) 样式上:不能直接控制width、height,只能使用盒模型部分属性,如padding、line_height、margin-left、margin-right。 内联元素的宽高是由本身内容的大小决定(文字、图标等) 常见行内元素3、 行内块状元素:尽可能少的占用横向空间,和其他元素都在一行上;可以设置width、height、margin、padding等盒模型相关属性。 *常用:img、input、td。 二、元素之间的转化:display:block;(将元素变为块级元素) display:inline; (将元素变为行级元素) display:inline-block;(将元素变为行级块元素) 三、其他a. 块元素特立独行;内联元素随波逐流。 b.块元素通常用作网页的主要构建模块,而内联元素常用来标记小段内容(修饰文本) c.设计一个页面时,一般从较大的块开始 ,然后完善页面的时候再加入内联元素。 d. 对标签能够清晰的分类,掌握标签的特性,在选择标签时避免犹豫不决,提高布局效率。 四、html5新特性HTML5新结构标签 结构标签HTML5-新的属性语法 属性语法HTML5图形 图形标签HTML5音视频标签 音视频标签对本地离线存储的更好的支持 新的表单控件,比如 calendar、date、time、email、url、search 移除的元素: 纯表现的元素:basefont,big,center,font, s,strike,tt,u; 对可用性产生负面影响的元素:frame,frameset,noframes; 支持HTML5新标签: IE8/IE7/IE6支持通过document.createElement方法产生的标签,可以利用这一特性让这些浏览器支持HTML5新标签,浏览器支持新标签后,还需要添加标签默认的样式。当然也可以直接使用成熟的框架、比如html5shim; 如何区分HTML5: DOCTYPE声明\新增的结构元素\功能元素 |
CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3 |