【我与bug那些事】当遇到 , 等标点符号时，如何实现换行？

最新推荐文章于 2023-06-22 00:52:03 发布
最新推荐文章于 2023-06-22 00:52:03 发布
阅读量762 收藏 3
点赞数 1
分类专栏： 我与bug那些事 文章标签： 遇到标点符号 实现换行 我与bug那些事
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_43352901/article/details/109316996
版权

当遇到 , 等标点符号时，如何实现换行？

遭遇

今天遇到一个很小的问题，就是👇

在这里插入图片描述
将上面文本域的内容，转化为👇的形式

在这里插入图片描述
刚开始的时候，我以为旁边的1 2 3 4 5 需要展示出来，就一直在查找如何在文本域左边设置一栏，自动对应输入的内容，后来我的师傅和我说，不需要这样，只需要遇到 , 换行即可，当时脑子没转过来，还去搜了如何 CSS遇到逗号进行换行？？？word-break: break-word ???

在这里插入图片描述
后来我的师傅过来和我说，直接用 JS split + join 就可以啦 我TM一脸懵逼了 怎么没想到哈哈哈哈

一行代码解决
a.split(
最低0.47元/天 解锁文章
Milk595
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
IE7 float:right 右浮动时元素换行错位的bug解决方法
09-25
次的情况与上次不同，上次直接将浮动的元素移到不浮动的元素之前就可以解决问题，而这次的float:right 时元素换行错位的情况，在下文也给出了不错的解决方法
CSS制作网页时遇到BUG的解决方法
09-27
网页制作Webjx文章简介：如果在用CSS设计网页时遇到BUG，请认真阅读以下内容，非常容易记忆的，不知道哪位高人把CSS BUG编成了顺口溜了！看看好不好记住呢？ 如果在用CSS设计网页时遇到BUG，请认真阅读以下内容，...
HTML+CSS中控制长字符串的自动换行问题
Dream Space
08-09 7498
原文地址： 在HTML+CSS中，长字符串的自动换行问题，总是造成意想不到的麻烦。下面是一些相关的总结。   针对于div、p等块级元素： 1.对于正常文字的换行（亚洲文字和非亚洲文字）元素拥有默认的white-space:normal，当定义的宽度之后自动换行。 1 #wrap{white-space:normal; width:200px;
Css 强制英文自动换行以及word-wrap、word-break、white-space、overflow的用法
colin5210的博客
06-22 6677
1、Css强制英文或数字自动换行 2、让中文按关键词或标签换行 3、Css强制中文不自动换行 4、Css强制中文不自动换行并自动隐藏； 5、Css中英文或数字的超出部分自动省略号…； 6、Css中word-wrap、word-break、white-space、overflow、text-overflow的用法讲解；
css标点符号换行
weixin_30657999的博客
09-18 2693
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .test{ word-break:break-w...
CSS英文字符串换行（word-break: break-all 或者 word-wrap）
黄彪博客
01-28 2万+
文章参考 英文强制换行css 使用css强制英文单词断行代码 问题描述 在工作中，给表单的某个字段添加描述信息，于是，测试就输入了’dddddd…(500个)’，查看详情的时候，就出现了横向滚动条，这样就不能直观的显示，于是提了bug 解决过程 遇到不换行的问题，第一反应就是设置div的宽度，‘display: inline-block’，甚至尝试了 ‘float:left’，界面效果依然没有变化 请教了同事，说上面的例子是因为浏览器认为’dddddd…(500个)'是一个单词，默认是不会换行的，于
E7 float:right 时元素换行出现在下一行的bug解决方法
09-25
如果前面几个元素没有设置浮动，而给最后的元素设置为float：right，则被设置为浮动的这个元素会出现在下一行，针对这个问题，下文给出详细的解决方法，感兴趣的朋友不要错过
积木报表换行bug修复的资源
11-02
本资源主要针对积木报表在处理换行和换页时出现的BUG进行修复，特别适合于那些在调用后端API过程中遇到此类问题的开发人员。 1. **换行BUG**：在报表设计中，换行是常见的需求，比如单元格内容过长需要自动换行或者...
基于SSM的“bug管理系统”的设计与实现.zip
最新发布
05-03
基于SSM的“bug管理系统”的设计与实现基于SSM的“bug管理系统”的设计与实现基于SSM的“bug管理系统”的设计与实现基于SSM的“bug管理系统”的设计与实现基于SSM的“bug管理系统”的设计与实现基于SSM的“bug管理...
文本换行-截断CSS
01-23
设置div内单行文本截断，文本截断，下载文件内含 关键css和属性解析地址
总结html，css中的各种换行方法
南北极之间
01-18 2万+
一般情况下，元素拥有默认的white-space:normal（自动换行，不换行是white-space:nowrap）,当录入的文字超过定义的宽度后会自动换行，但当录入的数据是一堆没有空格的字符或字母或数字（常规数据应该不会有吧，但有些测试人员是会这样子做的），超过容器宽度时就会把容器撑大，不换行。例如英语，浏览器会根据容器尺寸，选择在半角空格或连字符处换行。在页面中出现大段的文字，通常采用分段进行规划，对换行也有极其严格的划分。normal : 　依照亚洲语言和非亚洲语言的文本规则，允许在字内换行。
css文字换行方式以及单行超出文字变省略号以及多行超出变省略号
qq_48146070的博客
07-30 1080
可以用于文本换行，但是该属性不能使长标点符号换行；来实现文本的自动换行；当文本所在容器的宽度固定时，可以使用。可以用于将长标点符号进行换行；也可以用于长标点符号的换行。可以用于防止文本自动换行；可以用于使用连字符连接单词。...
js通过识别字符串中的分号进行换行
Kevin李宏飞的博客
12-25 8711
var str = "温馨提示：您的手机已于2017-10-14 7：30分欠费20元;您的手机已于2017-10-14 8：30分欠费30元；您的手机已于2017-10-14 9：30分欠费40元；"; var reg = /[;；]/g; str=str.replace(reg,"$&amp;\r\n"); console.log(str);...
css 标点符号换行,字母汉字可以换行 标点符号不能换行_html/css_WEB-ITnose
weixin_36317317的博客
08-03 1103
如图部分代码如下： hello.你好呀!标点不会自动换行标点不会自动换行标点不会自动换行。。。。。。。。。。。。。。。。。。。。。。。。hello12:30标点不会自动换行标点不会自动换行标点不会自动换行标点不会自动换行标点不会自动换行标点不会自动换行hellohellohellohellohellohellohellohellohellohellohellohellohellohellohe...
CSS样式—之强制换行的写法
axl19530209的专栏
01-13 1664
内容提要：CSS样式—之强制换行的写法，大家都知道连续的英文或数字能是容器被撑大，不能根据容器的大小自动换行，下面是 CSS如何将他们换行的方法！     大家都知道连续的英文或数字能是容器被撑大，不能根据容器的大小自动换行，下面是 CSS如何将他们换行的方法！     1.（IE浏览器）white-space:normal; word-break:break-all;这里前者是遵循标准。
【css】标签中文字根据宽度自动换行
西瓜那么甜
11-20 2531
word-wrap: break-word; word-break: break-all; overflow: hidden;
vscode中设置css样式里让逗号不换行
qq_45052616的博客
04-27 624
vscode中css样式里给多种属性同时设置样式时应该是这样的， 但是我格式化后却变成了这个样子
CSS强制英文、中文换行与不换行 强制英文换行
热门推荐
pan_junbiao的博客
04-01 7万+
1. word-break:break-all;只对英文起作用，以字母作为换行依据 2. word-wrap:break-word; 只对英文起作用，以单词作为换行依据 3. white-space:pre-wrap; 只对中文起作用，强制换行 4. white-space:nowrap; 强制不换行，都起作用 5. white-space:nowrap; overflow:hidden; te...
遇到较难复现的bug时，你会采取怎样的思路复现bug呢？
04-21
作为一个技术智能AI，我会按照以下步骤来复现bug： 1. 重现：尽量重现出bug，同时记录步骤和细节。 2. 查找：查找相关的代码和文档，理解相关编程语言和库的机制。 3. 对比：对比正常情况和异常情况，分析差异与...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值