gpt4 book ai didi

html - 如何向 div 添加空格但同时保留 div 中的文字?

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

如何向具有空白功能的 div 添加单词,同时又不会从 div 中泄漏出来?

<!DOCTYPE html>
<html>
<head>
<style>
p.test {
width: 11em;
border: 1px solid #000000;
word-wrap: break-word;
white-space: pre;
}
</style>
</head>
<body>

<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

</body>
</html>

最佳答案

您可以使用 overflow-x css 属性。将其设置为滚动使其可滚动。可以使用hidden使其溢出时不显示。

编辑: overflow-x:auto 仅在@Commercial Suicide 建议的必要时应用滚动条。

<!DOCTYPE html>
<html>
<head>
<style>
p.test {
border: 1px solid #000000;
word-wrap: break-word;
white-space: pre;
overflow-x:auto;
width:auto;
}
</style>
</head>
<body>

<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

</body>
</html>

隐藏版本:

<!DOCTYPE html>
<html>
<head>
<style>
p.test {
width: auto;
border: 1px solid #000000;
word-wrap: break-word;
white-space: pre;
overflow-x:hidden;
}
</style>
</head>
<body>

<p class="test"> This paragraph contains a very long word: thisisaveryveryveryveryveryverylongword. The long word will break and wrap to the next line.</p>

</body>
</html>

关于html - 如何向 div 添加空格但同时保留 div 中的文字?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/46374649/

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