元素类型
根据css显示分类,XHTML元素分为
三种类型:
块元素、内联元素、可变元素
& amp& amp?
三种类型:块元素、内联元素和内联块元素(在css2.1中添加)
块状元素的特征
答:块状元素在网页中是以块的形式显示的,所谓块状元素就是显示为矩形区域。
b:默认情况下,块元素会占据一行。一般来说,两个相邻的块元素不会并排显示;默认情况下,块元素按从上到下的顺序排列。
c:块元素都可以定义自己的宽度和高度。
d:块元素一般用作其他元素的容器,可以包含其他行内元素和其他块元素。我们可以把这个容器比作一个孩子。
内联元素的特征
答:内联元素总是在一行中一个接一个显示;
B: Inline元素没有自己的形状,宽度和高度无法定义。其显示的宽度和高度只能根据其所包含内容的高度和宽度来确定,其最小的内容单元也将呈现矩形;
c:内联元素也遵循box model的基本规则,如填充、边框、边距、背景等属性可以定义,但个别属性无***确显示;(填充顶部:;边距-顶部/底部:;)
可变元素
需要根据上下文来确定该元素是块元素还是行内元素。
通用标签
块
div -最常用的块级元素dl - 和dt-dd 搭配使用的块级元素form - 交互表单h1 -h6- 大标题hr - 水平分隔线ol – 有序列表p - 段落ul - 无序列表lifieldset - 表单字段集colgroup-col - 表单列分组元素table-tr-td 表格及行-单元格
内联
a –超链接(锚点) b - 粗体(不推荐) br - 换行 i - 斜体em - 强调 img - 图片 input - 输入框 label - 表单标签 span - 常用内联容器,定义文本内区块strong - 粗体强调sub - 下标 sup - 上标textarea - 多行文本输入框u - 下划线select - 项目选择
元素类型的转换
显示属性
模型可以通过display属性更改默认显示类型。
A.大多数block元素的display属性的默认值是block,list li的默认值是list-item。
B、大部分内联元素的display属性值默认为inline,其中img,input,默认为inline-block(行内块元素)。b、大多数内联元素的显示属性值默认为inline,其中img、input、inline-block(内联块元素)默认为。
内联块(内联块元素)
若要将元素设置为在容器中垂直居中,必须将默认的display属性值更改为inline-block。并添加相同的级别元素(标尺)
(同级元素[ruler]的样式设置为vertical-align:middle;宽度:0;身高:100%;显示:内嵌-块;)
三个条件:
必须给容器(父元素)加上text-align:center;必须给当前元素转成行内块元素(display:inline-block;)再给当前元素加上vertical-align:middle;在当前元素的后面(没有回车)加上同级元素span;并对span进行vertical-align:middle;width:0;height:100%;display:inline-block
元素类型Case
置换元素替换元素
一、导言
在之前的浅谈HTML中的块级元素和内联元素中了解到了内联元素一般是不能设置宽高的,但是也有特殊。比如img是内联元素,但可以设置宽高,这肯定让不少人迷惑。这样我们就要引入HTML中置换元素的概念(非置换元素在w3c中没有给出明确的解释,姑且我们就把除置换元素外的元素当作非置换元素吧)。在前面讨论HTML中的块级元素和行内元素时,我们了解到行内元素的宽度和高度是不能设置的,但它们也是特殊的。比如img是一个inline元素,但是它的宽度和高度是可以设置的,这当然让很多人很困惑。所以我们不得不在HTML中引入替代元素的概念(非替代元素在w3c中并没有明确的解释,所以我们把替代元素以外的元素作为非替代元素来处理吧)。
二。替换元素和非替换元素
a) 置换元素:浏览器根据元素的标签和属性,来决定元素的具体显示内容。 例如:浏览器会根据<img>标签的src属性的值来读取图片信息并显示出来,而如果查看(x)html代码,则看不到图片的实际内容;<input>标签的type属性来决定是显示输入框,还是单选按钮等。 (x)html中的<img>、<input>、<textarea>、<select>都是置换元素。这些元素往往没有实际的内容,即是一个空元素。a)替换元素:浏览器根据元素的标签和属性决定元素的具体显示内容。例如,浏览器将使用
? 置换元素在其显示中生成了框,这也就是有的内联元素(img,input)能够设置宽高的原因。替换元素在其显示中生成一个框,这就是为什么一些内联元素(img,input)可以设置宽度和高度。
b)不可替代元素(non-replaceable elements):(x)x)html的大部分元素都是不可替代的元素,即其内容直接呈现给客户端(如浏览器)。
本文来自牙可爱的骚云吖~投稿,不代表舒华文档立场,如若转载,请注明出处:https://www.chinashuhua.cn/24/475630.html