问题演示:
<style>
div{
border: 1px solid red;
}
</style>
</head>
<body>
<div>
<img src="../css6/images/ldh.jpg" alt="">pink老师
</div>
</body>
运行结果:
底边出现空隙:
解决方法:
在style里加入
img{
vertical-align: bottom;
}
然后可以了:
方法二:将图片转化为块级元素
/* 方法2:将图片转化为块级元素 */
img{
display: block;
}