【HTML】实现 pre 标签内容超出自动换行

news/2024/5/16 5:22:37

文章目录

  • 示例:
<pre>
一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本,一串很长的文本。
</pre>
  • 设置css超出换行属性:
pre {white-space: pre-wrap;
}
  • white-space 解析:
描述
normal默认,空白会被浏览器忽略。
pre空白会被浏览器保留,其行为类似HTML中的<pre>标签。
nowrap文本不会换行,文本会在同一行上继续,知道遇到<br>标签为止。
pre-wrap保留空白符序列,但是正常的进行换行。
pre-line合并空白符序列,但是保留换行符。
inherit规定应该从父元素继承white-space属性的值。

http://www.mrgr.cn/p/02117223

相关文章

关于零长度数组的思考

首先看一下以下的结构声明 struct Packet {int cmd;int len;char body[0]; };可以看到body被声明为一个长度为0的字符数组。经过测试,sizeof(Packet)的值为8,也就是说body实际上并没有分配内存。这种数组被称作零长度数组(Arrays of Length Zero)或者柔性数组,其中char bo…

2024第十五届蓝桥杯网络安全赛项部分题目 WriteUp

2024第十五届蓝桥杯网络安全赛项部分题目 WriteUp2024第十五届蓝桥杯网络安全赛项部分题目 WriteUp 爬虫协议 根据提示,访问/robots.txt,得到敏感路径 /38063b612387b10e22f4bd0d71a46a4e/,访问其中的/9de33df789dc91e984a091e6dce2dfb1得到flag。 flag{494547b4-f13f-47de-…

利用GaussDB的可观测性能力构建故障模型

D-SMART高斯专版已经开发了几个月了&#xff0c;目前主要技术问题都已经解决&#xff0c;也能够初步看到大概的面貌了。有朋友问我&#xff0c;GaussDB不已经有了TPOPS了&#xff0c;为什么你们还要开发D-SMART高斯专版呢&#xff1f; 实际上TPOPS和D-SMART虽然都可以用于Gaus…

Linux内核源码-存储驱动之 QSPI Flash

传输方式 DIO/QIO/DOUT/QPIQPI模式(Quad Peripheral Interface),所有阶段都通过4线传输。与之相对的是SPI。 SPI模式:纯种SPI(MISO/MOSI两个数据线) DOUT 全称 Dual I/O,命令字和地址字均为单线,仅在数据阶段为双线。 QOUT 全称 Quad I/O,命令字和地址字均为单线,仅在数据…

求极限的方法总结

求极限的方法总结 两个重要极限: \(\Large \underset{x\rightarrow 0}{\lim}\frac{\sin x}{x} = 1\) \(\Large \underset{x\rightarrow \infty}{\lim}(1+\frac{1}{x})^x=e\) 1. 直接代入 函数在某点连续,函数在该点的极限等于该点的函数值 一切初等函数在其定义区间内都是连续…

VPN的基本概念

随着互联网的普及和应用的广泛&#xff0c;网络安全和隐私保护越来越受到人们的关注。在这个信息爆炸的时代&#xff0c;我们的个人信息、数据通信可能会受到各种威胁&#xff0c;如何保护自己的隐私和数据安全成为了一个迫切的问题。而VPN&#xff08;Virtual Private Network…

Windows下绑定线程到指定的CPU核心

在某些场景下,需要把程序绑定到指定CPU核心提高执行效率。通过微软官方文档查询到Windows提供了两个Win32函数:SetThreadAffinityMask和SetProcessAffinityMask 为指定线程和进程设置处理器关联掩码。通俗的讲就是在指定的CPU核心上执行线程或者进程。这里的CPU核心指的是逻辑…

Web前端安全问题分类综合以及XSS、CSRF、SQL注入、DoS/DDoS攻击、会话劫持、点击劫持等详解,增强生产安全意识

前端安全问题是指发生在浏览器、单页面应用、Web页面等前端环境中的各类安全隐患。Web前端作为与用户直接交互的界面&#xff0c;其安全性问题直接关系到用户体验和数据安全。近年来&#xff0c;随着前端技术的快速发展&#xff0c;Web前端安全问题也日益凸显。因此&#xff0c…

环境安装:python环境迁移(无网和有网)

前言 环境部署或迁移是一项简单而又考验应对能力的一项工作&#xff0c;需要考虑到网络环境的情况&#xff0c;无网环境下需要采取离线方式进行操作&#xff0c;有网环境则可以直接通过在线安装完成。 在进行Python环境迁移时&#xff0c;需要注意保持环境的一致性&#xff0c;…

html-docx-js 导出word

1:列表页面按钮<el-button type="warning" plain icon="el-icon-download" size="mini" @click="exportWorddata" >导出word</el-button>…

vue2集成ElementUI编写登录页面

目录 1. 整理目录文件&#xff1a; a. app.vue文件如下&#xff1a; b. Login.vue文件如下&#xff1a; c. router/index.js文件如下&#xff1a; d. 删除components中的文件&#xff1a; e. 最终项目目录整理如下&#xff1a; 2. 集成ElementUI编写登录页面 a. 安装El…

notepadd++下载

现在网上下载个软件越来越麻烦了,各种广告各种隐藏陷阱。 为了大家以后能更快速的下载到正版的notepad++ 这里上传到git做了备份下载地址 : https://gitee.com/liu_chaos/notepad-8.5.3-official-version/blob/master/Notepad_downloader.8.5.3.exe本文来自博客园,作者:lan…

AI视频分析技术的常用开源模型及TSINGSEE青犀AI视频识别分析能力介绍

AI视频分析技术是指利用人工智能技术来对视频数据进行分析和处理的技术。开源模型是指可以免费获取和使用的代码模型&#xff0c;可以帮助开发人员快速构建和部署AI视频分析应用程序。 以下是一些业内常用的用于AI视频分析技术的开源模型&#xff1a; OpenCV&#xff1a;Open…

【稳定检索|投稿优惠】2024年应用数学、建模与计算机工程国际会议(IASAMCE 2024)

2024 International Conference on Applied Mathematics, Modeling, and Computer Engineering 一、大会信息 会议名称&#xff1a;2024年应用数学、建模与计算机工程国际会议 会议简称&#xff1a;IASAMCE 2024 收录检索&#xff1a;提交Ei Compendex,CPCI,CNKI,Google Schola…

linux安装selenium步骤

1,安装selenium模块pip3 install selenium2,安装谷歌浏览器yum install https://dl.google.com/linux/direct/google-chrome-stable_current_x86_64.rpm -y3安装chromedriver1)运行下面命令查看浏览器版本google-chrome --version 出现这个代表谷歌浏览器安装成功 2)谷歌浏览…

tada68键盘的设置

一、到网址:https://config.qmk.fm/,选择tada68 二、选择键位层,设置键位时可从键位码直接拖拽即可,此处设计0键位层,键位是:此处设计1键位层,键位是:键位码:三、设置好了,可以编译了,点击右上角的编译图标编译过程会出来一个大土豆旋转,直到出现:Checking file s…

Spring AI 抢先体验,5 分钟玩转 Java AI 应用开发

Spring Cloud Alibaba AI 以 Spring AI 为基础,并在此基础上提供阿里云通义系列大模型全面适配,让用户在 5 分钟内开发基于通义大模型的 Java AI 应用。作者:刘军 Spring AI 是 Spring 官方社区项目,旨在简化 Java AI 应用程序开发,让 Java 开发者像使用 Spring 开发普通应…

GPT的全面历史和演变:从GPT-1到GPT-4

人工智能新篇章&#xff1a;GPT-4与人类互动的未来&#xff01; 本文探讨了生成式预训练 Transformer (GPT) 的显着演变&#xff0c;提供了从开创性的 GPT-1 到复杂的 GPT-4 的旅程。 每次迭代都标志着重大的技术飞跃&#xff0c;深刻影响人工智能领域以及我们与技术的互动。 我…

开发工具IDEA

IDEA个人使用偏好,笔记。图居多,文字少,可自行参考(个人使用版本:2021.2.2)由于某些原因限制,所以不解释为什么还不更新使用新版本,可自行检索,答案很少,但存在即合理。有疑问可私信! 下载 步骤: 进官网 官网,https://www.jetbrains.com.cn/ 切换语言选择工具进入…

将针孔模型相机 应用到3DGS

Motivation 3DGS 的 投影采用的是 CG系的投影矩阵 P P P, 默认相机的 principal point (相机光心) 位于图像的中点处。但是 实际应用的 绝大多数的 相机 并不满足这样一个设定&#xff0c; 因此我们 需要根据 f , c x , c y {f,c_x, c_y} f,cx​,cy​ 这几个参数重新构建3D …