css - 如何在 CSS 中添加换行符
问题描述
我正在使用允许自定义 CSS 调整特定设置的 3rd 方应用程序。这是从 Chrome 中提取的数据
<textarea readonly="readonly"
disabled="disabled"
class="cComment TextEntry"
id="C050590L"
name="@C050590L"
type="Text" maxlength="4000"
rows="12"
style="width:100%">2020-01-30: On x710 Controller types, 1GbE is not supported with DAC Cable. You can ONLY get 1GbE support with Optical cable/ 1G Transceiver.* 2020-02-13: On X710 Controller types, the link capabilities and autoneg are inconsistent on different firmware releases.
The changes that were made between various FW versions are confidential and cannot be shared externally but the output you see is on your particular FW is what should be considered appropriate.* 2018-02-07: On xl710 controllers, the BOOTUTIL will display 40GbE under Series. This is correct since this chip splits the signal to 4x10GbE.* 2020-01-28: We have confirmation from Intel that LLDP on FW 7.0 should stay persistent once disabled (even after the reboot). For this, we need the latest Intel driver (24.5 or later).*
</textarea>
我希望在我的自定义 css(cComment)中做的是在样式中提到的每个日期之后开始一个新行。这可以根据此处提供的代码来计算吗?
.cComment {
text-transform: uppercase;
color: red;
}
解决方案
您不能直接将 css 添加到给定 HTML 元素内容的不同部分,而无需修改您的 HTML 内容。可以通过四种方式添加空格:
- 在需要的地方将
<br/>
标签放入内容中。 - 使用显示属性:块级元素从新行开始,您需要将内容放在要从下一行开始的单独 HTML 元素(例如 div)中。
- 使用“white-space: pre”,它可用于保留空格并准确显示您在 HTML 标记中使用换行符编写内容的方式。
- 对你总是想从新行开始的内容使用标签,因为 div 是块行元素。
对于上述所有这些方式,您将需要访问您的 HTML 内容,因为它需要进行一些修改才能将从日期开始的行变为新行。
推荐阅读
- vue.js - 如何使用两个 v-navigation-drawer?
- c++ - 由于内存映射,无法处理视频或 Videopath
- python - 基于Django函数的视图分页不起作用
- angular - 在 nz-row 和 nz-col 上构建和服务失败
- android - telnet 可以用来在通过 USB 连接的真实 android 设备上设置 gps 位置吗?
- javascript - 如何检查是否仅使用 JavaScript 选择了单选按钮?
- javascript - 如何处理网络浏览器中弹出的身份验证
- java - ListSelectionListener 在调用 setSelected 方法时不会触发事件
- javascript - X 轴上的 Charts.js + Django 日期
- mysql - 选择 table1 中的所有行,以及 table2 中不在表 1 中的行