gpt4 book ai didi

html - 表单的字体大小会改变表单的大小,即使元素的大小相同

转载 作者:行者123 更新时间:2023-11-28 07:26:00 29 4
gpt4 key购买 nike

我在设计一些 Web 表单时遇到了麻烦。在我的情况下,表单从 body 元素继承了字体大小。在示例中,它设置为 form 只是为了说明问题。

有这两种形式:

<form>
<input type="text" />
<input type="submit" />
</form>

<form style="font-size:24px">
<input type="text" />
<input type="submit" />
</form>

人们会期望这些表单看起来相同,因为表单元素在两种情况下都具有相同的尺寸。但是,表单的高度以及输入文本和提交按钮之间的空间不同。有人可以解释发生了什么以及如何防止这种大小变化吗? (我不喜欢将表单的字体大小设置为 0px)

最佳答案

如果您希望有更大的文本但又不想打扰您的任何元素,那么:

  1. 要么将所有内容扭曲成 <div style="position:relative;">或提供您的 <body> position: relative; .
  2. 然后将您的文本包装在 <div style="position: absolute;">

这应该使您的文本“脱离流程”,这意味着文本的定位和调整大小不应影响任何未定位的内容或布局。此外,您可以使用 z-index 将您的文本“ float ”在非定位(或更通常称为“静态”)内容上。参见 here 详情

关于html - 表单的字体大小会改变表单的大小,即使元素的大小相同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31810226/

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