gpt4 book ai didi

html - 背景颜色环绕图像

转载 作者:太空狗 更新时间:2023-10-29 16:45:44 25 4
gpt4 key购买 nike

我希望我页面的 Logo 位于左上角并被黑色背景包围。但是,背景色不会覆盖图像右侧的区域。我正在使用 HTML 和 CSS。

这是我的代码:

#title {
width: 100%;
height: 100%;
background-color: black;
}
#title img {
width: 50%;
height: 50%;
}
<!DOCTYPE html>
<html>
<link rel="stylesheet" type="text/css" href="index.css" media="screen" />

<body>
<div id="title">
<a href="index.html">
<img src="http://i.stack.imgur.com/WE2r4.png" align="left" />
</a>
</div>
</body>

</html>

最佳答案

删除 align="left" 属性。它的作用类似于使图像 float: left,但是之后您永远不会清除 float ,因此父级崩溃并且您根本看不到背景:

#title {
width: 100%;
height: 100%;
background-color: black;
}
#title img {
width: 50%;
height: 50%;
}
<!DOCTYPE html>
<html>
<link rel="stylesheet" type="text/css" href="index.css" media="screen" />

<body>
<div id="title">
<a href="index.html">
<img src="http://i.stack.imgur.com/WE2r4.png" />
</a>
</div>
</body>

</html>

如果你想让标志左对齐,你应该使用 #titletext-align: left,它会正常工作,因为 img 是 inline-block by默认。

关于html - 背景颜色环绕图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31354727/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com