HTML里有许多的标签,每个标签都能赋予其css不同的样式,不同标签的使用场景和使用方式都是有所不同,因此主要把标签元素分为了三类!
元素类型有:
块状元素;
内联元素;
内联块元素;
不同的元素在HTML里的显示方式不同,应用场景也不同,互相合理配合使用就可以灵活的产生不同的网页效果!
常见的一些块状元素有一下:
div -最常用的块级元素
dl - 和dt-dd 搭配使用的块级元素
form - 交互表单
h1 -h6- 大标题
hr - 水平分隔线
ol – 有序列表
p - 段落
ul - 无序列表
li;
这些块状元素在HTML的应用中普遍都有一些共同点;
1.块状元素都是独占一行的,哪怕他的右边还有空间也不会允许其他元素来占用;
2.该元素可以直接设置宽和高,背景颜色背景图片等属性;
3.严格遵守盒模型的显示规则,也就是说可以应用padding,margin,border这些属性;
4.块状元素可以在里面加入文本或者另外的其他内联元素和块状元素。
例如:
另外还有内联元素:
a –超链接(锚点)
b - 粗体(不推荐)
br - 换行
i - 斜体
em - 强调
img - 图片
input - 输入框
label - 表单标签
span - 常用内联容器,定义文本内区块
strong - 粗体强调
sub - 下标
sup - 上标
textarea - 多行文本输入框
u - ins下划线
select - 项目选择 ;
这些都是比较常见的内联元素特性如下:
1.内联元素是符合日常书写逻辑的,不管是多个内联元素,它们互相在网页中都是自左向右显示的;
2.不能直接定义宽高,它们的大小都是由自身内容的多少而决定的;
3.内联元素也是遵循盒模型显示规则的,可以使用padding、margin、border这些属性,但是有少部分显示会不正确;
4.补充:只要不是块状元素的都可以称之为内联元素。
示例:
这些就是HTML里面常用的元素了,多加掌握其显示规则,灵活运用就可以写出多样的网页效果了!