css--display属性中inline-block与inline的区别

inline-block 与 inline 的区别:

 

  inline-block 与inline 效果类似,但是inline-block是可以设定宽度和高度的!!而行内元素(也就是inline)是无法设置宽度和高度的,因宽度和高度仅仅对块元素生效。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .a{
            width: 200px;
            background-color: grey;
        }
    </style>
</head>
<body>
<div class="a"><p>hello world</p></div>
<span class="a">hello world</span>
</body>
</html>

浏览器显示结果:

原文地址:https://www.cnblogs.com/MnCu8261/p/5682963.html