gpt4 book ai didi

html - 宽度标签不工作 html/css

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

我正在为学校做这项作业,我需要将标语和小图片后面的背景放在一边,以便它完美地包围文字。但是,我无法使宽度标签起作用。请帮我找到这个问题的根源。抱歉,格式不佳。我有点时间紧迫。

<!DOCTYPE html>
<html>
<head>
<title>MNSportsInc</title>
</head>
<center><p><font size="8">Minnesota Sports Inc.</font></p></center>
<style>
h1 {color: white; background: black; font-family: times; font-size:
120%; width: 300}
h2 {color: white; background: black; font-family: times; font-size:
120%; width: 500}
h3 {color: white; background: black; font-family: times; font-size:
120%; width: 500}
h4 {color: white; background: black; font-family: times; font-size:
120%; width: 500}
h5 {color: white; background: black; font-family: times; font-size:
120%; width: 500}
h6 {color: white; background: black; font-family: times; font-size:
120%; width: 500}
</style>
<body>
<center>
<h1><a href="https://www.mlb.com/twins"><img src="Twins.gif"></a>Twins
get wins!<a href="https://www.mlb.com/twins"><img src="Twins.gif"></a></h1>
<!--Twins-->
<h2><a href="https://www.nhl.com/wild"><img src="Wild.png"></a>Crack a
smile for the Wild.<a href="https://www.nhl.com/wild"><img src="Wild.png">
</a></h2><!--Wild-->
<h3><a href="http://www.vikings.com/"><img src="Vikings.png"></a>Buy
things for the Vikings.<a href="http://www.vikings.com/"><img
src="Vikings.png"></a></h3><!--Vikings-->
<h4><a href="http://www.nba.com/timberwolves/"><img src="Wolves.jpg">
</a>Fans pull the Wolves!<a href="http://www.nba.com/timberwolves/"><img
src="Wolves.jpg"></a></h4><!--Timberwolves-->
<h5><a href="http://www.gophersports.com/"><img src="UofM.png"></a>Beat
the Gophers? No sir!<a href="http://www.gophersports.com/"><img
src="UofM.png"></a></h5><!--UofM-->
<h6><a href="http://crimson-activities.com/"><img src="Crimson.jpg">
</a>The Crimson have Risen.<a href="http://crimson-activities.com/"><img
src="Crimson.jpg"></a></h6><!--Crimson-->
</center>
</body>
</html>

最佳答案

width 属性(不是标记)的所有设置都缺少单位,因此根据 CSS 规范这些设置将被忽略。如果您附加例如它们,它们就会工作px 单位(对于 CSS 像素):width: 500px。像素是您可能想要使用的。如何设置背景使其“完美地包围文字”是一个完全不同的问题;您可能需要一种不同的方法,例如使用内联元素(根据需要占用尽可能多的宽度)。

<!DOCTYPE html>
<html>
<head>
<title>MNSportsInc</title>
</head>
<center><p><font size="8">Minnesota Sports Inc.</font></p></center>
<style>
h1 {color: white; background: black; font-family: times; font-size:
120%; width: 300px}
h2 {color: white; background: black; font-family: times; font-size:
120%; width: 500px}
h3 {color: white; background: black; font-family: times; font-size:
120%; width: 500px}
h4 {color: white; background: black; font-family: times; font-size:
120%; width: 500px}
h5 {color: white; background: black; font-family: times; font-size:
120%; width: 500px}
h6 {color: white; background: black; font-family: times; font-size:
120%; width: 500px}
</style>
<body>
<center>
<h1><a href="https://www.mlb.com/twins"><img src="Twins.gif"></a>Twins
get wins!<a href="https://www.mlb.com/twins"><img src="Twins.gif"></a></h1>
<!--Twins-->
<h2><a href="https://www.nhl.com/wild"><img src="Wild.png"></a>Crack a
smile for the Wild.<a href="https://www.nhl.com/wild"><img src="Wild.png">
</a></h2><!--Wild-->
<h3><a href="http://www.vikings.com/"><img src="Vikings.png"></a>Buy
things for the Vikings.<a href="http://www.vikings.com/"><img
src="Vikings.png"></a></h3><!--Vikings-->
<h4><a href="http://www.nba.com/timberwolves/"><img src="Wolves.jpg">
</a>Fans pull the Wolves!<a href="http://www.nba.com/timberwolves/"><img
src="Wolves.jpg"></a></h4><!--Timberwolves-->
<h5><a href="http://www.gophersports.com/"><img src="UofM.png"></a>Beat
the Gophers? No sir!<a href="http://www.gophersports.com/"><img
src="UofM.png"></a></h5><!--UofM-->
<h6><a href="http://crimson-activities.com/"><img src="Crimson.jpg">
</a>The Crimson have Risen.<a href="http://crimson-activities.com/"><img
src="Crimson.jpg"></a></h6><!--Crimson-->
</center>
</body>
</html>
htmlcssimagewidth

关于html - 宽度标签不工作 html/css,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44055767/

25 4 0