mysql padding_margin和padding对行内元素的影响

这个是在面试的时候，面试官问我的一个小问题 自己没有考虑过inline元素设置margin和padding的问题 学习的过程记录下来

1)inline元素的高度是由元素的内容决定的(字体的大小和行高) 比如你对一个a标签设置它的高度是没有效果的

2)HTML元素分为替换元素和非替换元素 替换元素指的是作为其他的元素占位符的一个元素 例如img   非替换元素指内容包含在文档中的元素  

hahaha

这个p就是一个非替换元素 区分替换与非替换的方法：替换元素浏览器会根据标签和属性去决定元素的显示 非替换元素是直接将内容显示

进入主题  margin和padding对inline元素的影响 这里我们就要考虑替换元素与非替换元素的区别了

1)margin对inline元素的影响

我是行内非替换元素

我们对上面的元素设置样式

p {

background: red;

width:400px;

}

p img {

width:100px;

height:100px;

background: blue;

}

p img#a {

margin:20px;

}

p span {

margin-top:20px;

margin-left: 20px;

margin-right: 20px;

}

对上面的inline元素img设置了margin  发现四个方向的margin都有了效果