gpt4 book ai didi

html - 背景图片在 #id 选择器中不会显示,但会显示在正文中

转载 作者:太空宇宙 更新时间:2023-11-04 09:12:48 25 4
gpt4 key购买 nike

我目前正在为 Odin 重新创建 Google 主页并尝试将 Logo 设置为背景图片。每当我将背景图片和 URL 放入 CSS 正文中时, Logo 就会显示出来。但是,当我将确切的行复制并粘贴到 Logo 中时,图像根本不显示!

* {
padding: 0;
margin: 0;
border: 0;
box-sizing: border-box;
}
body {
width: 100%;
height: 100%;
}
#logo {
background: url("https://upload.wikimedia.org/wikipedia/commons/thumb/2/2f/Google_2015_logo.svg/2000px-Google_2015_logo.svg.png");
background-size: 272px 92px;
background-repeat: no-repeat;
}
<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<title>Google</title>
</head>

<body>
<div class="main">
<a href="www.google.co.uk" id="logo"></a>
</div>
</body>

</html>

有什么地方出错了吗?

最佳答案

anchor 标签中没有内容。

如果你不想在 anchor 标签内提供任何内容,你应该制作显示 block 并提供高度或者你也可以使用inline-block提供宽度和高度

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="stylesheet.css">
<title>Google</title>
</head>
<body>
<div class="main">
<a href="www.google.co.uk" id="logo"></a>
</div>
</body>
</html>



* {
padding: 0;
margin: 0;
border: 0;
box-sizing: border-box;
}

body {
width: 100%;
height: 100%;
}

#logo {
background: url("imgs/google-logo.png");
background-size: 272px 92px;
background-repeat: no-repeat;
display: block;
height: 300px;
}

关于html - 背景图片在 #id 选择器中不会显示,但会显示在正文中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42001390/

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