inline、inline-block、block的区别 #42
Comments
|
关于行内元素的margin，padding，左右设置是有效的，但是padding上下方向只是从显示效果上是增加的，但是实际上又是不会挤开其他元素的。 相关参考：https://blog.csdn.net/qq_37852483/article/details/88762561 下面是我的测试 <!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>行内元素的padding，margin设置的有用吗</title>
<style>
* {
margin: 0;
padding: 0;
}
.span1 {
margin: 20px;
}
.span2 {
padding: 20px;
}
</style>
</head>
<body>
<p>看下会不会把我挤走 <span class="span1">我是span啊</span>
理论上达拉斯的
</p>
<p>看下会不会把我挤走 <span class="span2">我是span啊</span>
理论上达拉斯的
</p>
</body>
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
block：独占一行，可以设置宽高![]()
img>和<input>.
inline：不会独占一行，不能设置宽高
inline-block：不会独占一行，能设置宽高。比如<
通常会引申到：margin和padding能对行内元素设置吗？
行内元素：
The text was updated successfully, but these errors were encountered: