(一)前端笔记——元素类型的分类?
在研究display这个属性之前,我们先来基本了解一下html元素类型的分类标准,根据css的显示,我们把css元素分为三种类型:块状元素(black)、内联元素(inline)、以及内联块元素(illine-block)。
块状元素在网页中的显示效果为矩形区域,即使它的右边区域存在着很大的空间,相邻两块区域并不会以并列的形式来显示;块状元素是可以直接定义自身的宽度以及它的高度,并且严格遵循box model的显示规则;块状元素一般作为容器来使用,里面可以存放一些文本元素,也可以存放一些块状元素和内联元素。
常见的块状元素(black):
div 一般用来定义文档的分区。
dl 自定义列表
Ol 有序列表
Ul 无序列表
Form 用来创建用户表单
H1-h6 定义标题
Table 定义HTML表格
常见的内联元素(inline):
A 超链接
B 粗体
Img 插入图片
Input 用户输入框
Span d定义文本内区块
Strong 粗体强调
(二)我所了解的display属性?
Display在英文翻译为展开的意思,在标准盒模型中可通过display属性来改变元素默认的显示类型。在以上的介绍当中,我们知道我们可以将元素分为块状元素(black)、 内联元素(inline)、以及内联块元素(illine-block);而不同元素类型之间的差异也就造就其本身所具备的独特点,比如块状元素的特点是独占一行,内联元素的特点是可以在同行显示,内联块元素却同时具备块状元素与内联元素的特点,而display这个属性值恰到好处的可以将不同类型的元素类型进行不同类型的转化,使之在必要的条件下进行元素的类型转化,让不同元素类型本身不具备的条件进行转换为可以满足的条件。
(三)display属性的运用。
下面我们将以导航背景图进行代码演示:
运行结果:
display属性及其应用。
最新推荐文章于 2023-05-17 15:53:56 发布