html标签有哪些分类

html标签有哪些分类?相信很多没有经验的人对此束手无策,为此本文总结了问题出现的原因和解决方法,通过这篇文章希望你能解决这个问题。

创新互联公司网站建设由有经验的网站设计师、开发人员和项目经理组成的专业建站团队,负责网站视觉设计、用户体验优化、交互设计和前端开发等方面的工作,以确保网站外观精美、成都网站制作、网站建设易于使用并且具有良好的响应性。

HTML标签的类型可分为三种:块级标签,行内标签,内联块状标签。

块级标签:

块状标签:标签独占一行,可指定宽、高。

特性:

  • 能够识别宽高

  • margin和padding的上下左右均对其有效

  • 可以自动换行

  • 多个块状元素标签写在一起,默认排列方式为从上至下

  • 可以使用margin:0 auto居中对齐

常用的块状元素有:

<div>、<p>、<h2>...<h7>、<ol>、<ul>、<dl>、<table>、<address>、<blockquote>、<form>

内联标签:

内联(行级)标签:标签在一行内,宽度与高度由内容决定,只有在内容超过HTML的宽度时,才会换行。

特性:

  • 无法设置宽高

  • margin上下无效,只有左右有效果,padding都有效果,会撑大空间;box-sizing:border-box;无效,因为该属性针对盒模型。

  • 不会自动换行

常用的内联元素有:

<a>、<span>、<i>、<em>、<strong>、<label>、<q>、<var>、<cite>、<code>

内联块状标签:

内联块状元素(inline-block)就是同时具备内联元素、块状元素的特点,代码display:inline-block就是将元素设置为内联块状元素。(css2.1新增),<img>、<input>标签就是这种内联块状标签。

特性:

  • 不会自动换行

  • 能够设置宽高

  • 默认排列方式为从左到右

  • 可以使用text-align:center使内容相对于父盒子水平居中对齐,例如img标签,可以使用text-align:center,相对父盒子居中对齐、margin:0 auto无效

  • 水平排列,但所有元素默认会有1个空格的间隙,因为元素之间在html中书写有回车换行,浏览器解析会将其解析成一个空格。

常用的内联块状元素有:

<img>、<input>

HTML标签类型是可以转换的:

  • display:inline;转换为行内元素

  • display:linline-block;转换为行内块元素

  • display:block;转换为块级元素

看完上述内容,你们掌握html标签有哪些分类的方法了吗?如果还想学到更多技能或想了解更多相关内容,欢迎关注创新互联行业资讯频道,感谢各位的阅读!

分享标题:html标签有哪些分类
分享链接:https://www.cdcxhl.com/article2/jhihoc.html

成都网站建设公司_创新互联,为您提供动态网站网站收录App设计定制网站App开发移动网站建设

广告

声明:本网站发布的内容(图片、视频和文字)以用户投稿、用户转载内容为主,如果涉及侵权请尽快告知,我们将会在第一时间删除。文章观点不代表本网站立场,如需处理请联系客服。电话:028-86922220;邮箱:631063699@qq.com。内容未经允许不得转载,或转载时需注明来源: 创新互联

微信小程序开发