XHTML元素类型

XHTML元素分类根据css显示状态，XHTML元素分为三种类型：块元素、内联（inline）元素和可变元素。块/块元素的三大特点：1、默认块元素占一行，相邻的两个块元素不会并排显示；默认情况下，块元素将按顺序从顶部排列到底部排列。2.块元素可以定义宽度和高度。3、块元素一般用作其他元素的容器，行内元素和块元素可以嵌套在开始标签和结束标签之间。一个块级元素可以看作是一个盒子，盒子里可以容纳其他的对象。常用的块级元素：div--最常用的块级元素dl--与dt-dd配合使用的块级元素form--交互形式h1-h6--标题ol--有序列表p--paragraphul--unorderedlistfieldset--form字段集colgroup-col--form列分组元素table-tr-td--tableandrow-cellinlineelement/inlineelement（行内元素）三大特点：1。一行可以显示多个内联元素2、内联元素不能定义宽高，它的宽高由元素内内容的高宽决定。3、行内元素也会遵循盒模型的基本规则。可以定义padding、border、margin、background等属性，但个别属性无法正确显示；(padding-top/bottom;margin-top/bottom;)常用内联元素a--超链接（锚点）b--粗体（不推荐）br--换行i--斜体em--强调字体--font设置（不推荐）img--图片输入--输入框标签--表单标签span--常用行内容器，定义文本块strong--粗体强调sub--下标sup--上标textarea--多行文本inputboxselect--itemselectionotherelementssuchas:inline块级（inline-block）,列表项（list-item）XHTML元素类型转换通过css的display属性和属性值（18个属性值）属性值：block/inline/inline-block/none/list-item/table-header-group/table-footer-group功能：该属性设置或获取元素生成的类型。block：分块显示，类似于在元素后加一个换行符，其他元素不能在它后面并排显示。（将元素转换为块元素，使元素具有块元素的特性；）inline：行内显示，多个元素可以在一行中并排显示。（元素转换为行内元素）inline-block：行内块级元素显示，一行显示多个，宽高可设置。none：隐藏元素，不占用空间。list-item：将元素转换为列表项。1、当元素上设置了float属性，相当于添加了一个display:inline-block；对元素的声明（设置宽度和高度，并显示多行）。2、大部分块元素的display属性值默认为block，listli默认值为list-item。3、大部分内联元素的display属性值默认为inline，img、input、textarea默认为inline-block。内联元素/行内元素在容器中垂直居中

div{宽度：200px；高度：200px；文本对齐：居中；背景：粉色；}p{显示：内联块；宽度：40px；高度：40px；垂直对齐：中间；对齐：中间；宽度：0；高度：100%；display:inline-block;}三个条件：1：父元素添加text-align:center；2：将当前元素转换为行内块元素(display:inline-block;)然后设置vertical-align:middle;3：在当前元素后添加同级元素span；并在span上执行vertical-align:middle;width:0;height:100%;display:inline-block;Textisverticallycenteredinthecontainerdiv{width:200px;高度：200px；文本对齐：居中；line-height:200px;Key:text-align:center;行高：200px；line-height的值应与高度保持一致。替换元素（内联可替换元素）和非替换元素1、替换元素：浏览器根据元素的标签和属性来决定元素的具体显示内容。例如：浏览器会根据img标签的src属性的值读取图片信息并显示出来，但是如果查看(x)html代码，是看不到图片的实际内容，以及类型input标签的属性决定是否显示输入框，或单选按钮等；html中的(x)img、input、textarea、select都是替换元素，而这些元素往往没有实际内容，即空元素。被替换的元素会在其显示中生成一个方框，这就是为什么一些内联元素（img、input）可以设置宽度和高度的原因。2、不可替换元素（non-replacementelements）：(x)html的大部分元素都是不可替换元素，即它们的内容直接显示在客户端（如浏览器）上。