请马上登录,朋友们都在花潮里等着你哦:)
您需要 登录 才可以下载或查看,没有账号?立即注册
x
本帖最后由 马黑黑 于 2023-1-7 12:00 编辑
pre 元素用于预格式化文本,它会保留文本的空格和制表符。通常,不做设置的话,pre 内的文本不会自动折行,超出预设宽度之后自动溢出。试看下面的例子:
第一行(前面是四个空格)
第二行(前面是Tab制表符) ABCDEFGHIJKLMNOPQRSTUVWXWZ123456789
我们设置一下 pre 标签:
white-space: pre-wrap;
OK,看看效果如果:
第一行(前面是四个空格)
第二行(前面是Tab制表符) ABCDEFGHIJKLMNOPQRSTUVWXWZ123456789
效果表明,文本已经自动折行了。折行的方式是默认的 break-word,由于后面的字符串是没有空格的一系列字母和数字,它们整体被视为一个单词。不论如何,pre里的自动折行事实存在,说明自动折行可以设置到 pre 元素之内,核心设置是 white-space: pre-wrap 。
white-space 属性用来设置段落中的文本是否折行,默认值是 normal ,按正常标准自动折行,其值还有 nowrap(不折行)、pre(按html的pre标签标准不折行)、pre-wrap(保留空白符序列,但是正常地进行换行)和 pre-line (合并空白符序列,但是保留换行符),还有一个继承值 inherit ,就是继承父元素的设置值。
html和css学问多多,一点一滴的积累不是问题,不过学习过程中要有探索精神,否则 pre 标签不能折行将成为一个错误的认知。
|