gpt4 book ai didi

javascript - 如何在其中的段落达到 500px 高度后将 div 的高度 (500px) 更改为自动?

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

我想要一个文本框,你可以在里面写东西,目前我正在使用一个带有背景的div和div里面的一个段落(

)。我希望 div 覆盖除边距之外的页面,但是如果你超过 500px 的限制,CSS 中的 div 高度会更改为自动,以便在你向下浏览页面时仍然有背景。

下面的代码不是完整版,为了简单起见,我删除了不需要的部分。

/* Body Preferneces */

body {
background-color: #00C5CD;
font-size: 25px;
}


/* Paragraph Text Preferences */

p {
font-size: 25pt;
color: #000;
}

#text {
background-color: #fff;
border: none;
text-align: left;
display: block;
font-size: 16px;
width: auto;
height: auto;
}
<!DOCTYPE html>
<html>

<head>
<link rel="stylesheet" href="CSS.css">
</head>

<body>
<div id="text">
<div id="identifier">
<p contenteditable="true"></p>
</div>
</div>
</body>

</html>

最佳答案

扩展@MichaelCoker 的评论...min-height 效果很好:

/* Body Preferneces */

body {
background-color: #00C5CD;
font-size: 25px;
}


/* Paragraph Text Preferences */

p {
font-size: 25pt;
color: #000;
}

#text {
background-color: #fff;
border: none;
text-align: left;
display: block;
font-size: 16px;
width: auto;
height: auto;
min-height: 500px;
}
<!DOCTYPE html>
<html>

<head>
<link rel="stylesheet" href="CSS.css">
</head>

<body>
<div id="text">
<div id="identifier">
<p contenteditable="true"></p>
</div>
</div>
</body>

</html>

希望对你有帮助

关于javascript - 如何在其中的段落达到 500px 高度后将 div 的高度 (500px) 更改为自动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44104665/

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