Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/html/76.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 为什么图像larrow不是';黄色背景的t? *{填充:0px;边距:0px;} .strip{宽度:1000px;边框:1px纯红色;清晰:无;高度:10px;} .box{显示:内联块;宽度:17px;高度:继承;} img{宽度:继承;高度:继承;}_Html_Css_Firefox - Fatal编程技术网

Html 为什么图像larrow不是';黄色背景的t? *{填充:0px;边距:0px;} .strip{宽度:1000px;边框:1px纯红色;清晰:无;高度:10px;} .box{显示:内联块;宽度:17px;高度:继承;} img{宽度:继承;高度:继承;}

Html 为什么图像larrow不是';黄色背景的t? *{填充:0px;边距:0px;} .strip{宽度:1000px;边框:1px纯红色;清晰:无;高度:10px;} .box{显示:内联块;宽度:17px;高度:继承;} img{宽度:继承;高度:继承;},html,css,firefox,Html,Css,Firefox,我遇到了问题,因为我放在“盒子”中的图像向下移动了一点。但当高度大于20px时,它会保持在原位。你能告诉我发生了什么事吗?当然可以。您的图像正与div的基线对齐。div的默认行高设置提供了基线与div顶部之间20px的距离,因此当图像为20px时,它将填充该空间。任何较大的值都会强制线条高度增加,但任何较小的值都会在上方留下间隙。各种解决方案都是可能的,具体取决于您希望发生什么,但是将图像设置为{vertical align:top;}是一种方法,或者将div.strip的行高度降低到图像的高度

我遇到了问题,因为我放在“盒子”中的图像向下移动了一点。但当高度大于20px时,它会保持在原位。你能告诉我发生了什么事吗?

当然可以。您的图像正与div的基线对齐。div的默认行高设置提供了基线与div顶部之间20px的距离,因此当图像为20px时,它将填充该空间。任何较大的值都会强制线条高度增加,但任何较小的值都会在上方留下间隙。各种解决方案都是可能的,具体取决于您希望发生什么,但是将图像设置为
{vertical align:top;}
是一种方法,或者将div.strip的行高度降低到图像的高度是另一种方法

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
</head>
<style type="text/css">
*{padding:0px;margin:0px;}
.strip {width:1000px;border:1px solid red;clear:none;height:10px;}
.box{display:inline-block;width:17px;height:inherit;}
img{width:inherit;height:inherit;}
</style>
<body>
<div class="strip" style="background-color:green;">

<div class="box" style="background-color:yellow;">
<img src="larrow.gif">
</div>

</div>
</body>
</html>