【html】常见的行标签（inline）、块标签（block）和行块标签（inline-block）特点及相互转换

贺情

已于 2022-05-17 20:55:00 修改

阅读量1.8w

点赞数 16

文章标签： html css 前端 html5

于 2022-04-13 19:39:58 首次发布

本文链接：https://blog.csdn.net/m0_50947589/article/details/124144601

版权

本文详细介绍了HTML中的行标签（如span、a、i等）、块标签（如div、标题、p标签）和行块标签（如img）的特点。包括它们的用法、样式特点以及如何通过display属性进行类型转换。内容涵盖行标签的换行解析、块标签的独占一行以及img标签的宽高支持。

摘要由CSDN通过智能技术生成

前言

本文总结了一些常见的HTML标签的用法以及特点，帮助看官您更好的掌握网页的构建。

提示：以下是本篇文章正文内容，下面案例可供参考

一、行标签

行标签又称内联标签，常见的行标签有span标签,a标签,br标签,i标签,b标签,em标签,strong标签,sup标签,sub标签等。

1.span标签

span标签没有具体的语义，通常用在编辑富文本时。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        span{
   
            background-color: aqua;
            width: 100px;
            height: 100px;
        }
    </style>
</head>
<body>
    <span>1</span>
    <span>2</span>
    <span>3</span>
    <span>4</span>
    <span>5</span>
    <span>6</span>
    <span>7</span>
    <span>8</span>
    <span>9</span>
    <span>10</span>
</body