gpt4 book ai didi

html - 我在 CSS 中的边框样式没有覆盖整个主体

转载 作者:可可西里 更新时间:2023-11-01 14:44:15 25 4
gpt4 key购买 nike

我试过把它放进去

   body{ border-style: double;}

还有

   #form{border-style: double;}

但边框只覆盖了一部分

      <!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Checkout</title>
<link rel="stylesheet" type="text/css" href="StyleSheet.css" />
</head>
<body>
<form id="form" runat="server">
<div>
<img src="banner.jpg" />
<br /><br />
<span id ="Checkout">Checkout</span><br /><br />

边框刚好环绕图像并在我放置后结帐 向左飘浮 在 CSS 中的其他 ID 之一中。如果我删除 float 然后边框工作正常。

请不要记下答案,我是一名学生,我正在逐步学习。因此,我们将不胜感激。

最佳答案

您面临的问题是 body(和 html)没有设置高度,它会扩展以包含未 float 的元素。只要您 float 内部元素,主体高度就会下降,塌陷。

您需要正确清除( float 元素的)包含父元素上的 float
您可以:

  • overflow:auto 设置为父 DIV 元素
  • 或使用特殊类(同样在父元素上):

.clearFix:before,
.clearFix:after {
content: " ";
display: table;
}
.clearFix:after {
clear: both;
}

另外,如果想直接给body添加边框,考虑到html, body设置为100%,在为了使您可能想要添加的底部边框可见

box-sizing:border-box;

到您的 body 元素。

jsBin demo of body with visible bottom border

关于html - 我在 CSS 中的边框样式没有覆盖整个主体,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32815176/

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