html字体变大自动换行,网页css中实现字符超出宽度自动换行和英语字符不断行的解决方法...
需求:
为了使英语字符不断开,我在显示内容的style是text-align:justify; text-justify:inter-ideograph。可是这样子在后台添加内容时,如果不是键盘输入的,而是copy到输入框里的话,这样前台显示出来的帖子内容会把表格撑得很宽。有人说采用自动换行就会解决这个问题style=”word-break:break-all”。可是这样一来,英语单词又断了。如何才能将这两个矛盾统一起来呢?
参考的帖子是这样的:
overflow:hidden的意思是超出溢出,通俗点就是超出不显示。
word-wrap:break-word的意思是自动段字换行。可能是针对与中文字。
word-break:break-all的意思也是是段字换行。它与上面的区别在于,可以断掉一些 较长的英文字母,使表单不至于撑破。主要针对于英文。
以下是详解:
1、三种样式都不写的情况下(只举英文例子)div的宽度是100px:
ni nia nia nidad niadnai nida nin andisdn nidasndadsfsdf dasdasdadad ada .
2、第二种情况只写overflow:hidden div的宽度是100px:
ni nia nia nidad niadnai nida nin
3、第三种情况overflow:hidden; word-wrap:break-word; div的宽度是100px;
ni nia nia nidad niadnai
nidasndadsfsdf nin ninniadnai nida nin .
注意:由于nidasndadsfsdf的单词太长所以不能给断开,所以,整个词给断下来了。
4、第四种情况overflow:hidden; word-wrap:break-word; word-break:break-all;
div宽度还是100px。
ni nia nia nidad niadnai nidasnda
dsfsdf nin ninniadnai nida nin .
注意:由于nidasndadsfsdf的单词被断开了。
上面的测试都没有问题,但是放到我的内容上面仍然还有问题。
最后,参考了很多论坛,终于找出了问题,问题原来出在 !空格的ASCII码为32,字符实体 的名字叫做”不中断空格”,其ASCII码为160。虽然显示出来可能 和空格一样,但浏览器可能不会将其和空格一样对待,所以那串英文成了一个”单词”,不会自动换行。
你只需将 再替换回去,而且在你的后台程序中将那句替换空格的语句去掉,如果这样会影响到排版,也可以将那句replace改成将两个空格替换成一个全角空格或两个 ,这样不会影响到单词间的单个空格。
造成这样的问题是由于编辑器的bug,使用的是ckeditor,之前一直都没有问题,格式化核心JS文件后就有了这个bug,修改的那叫一个汗啊,看来以后下载第三方插件的JS不能随便格式化或者净化了
html字体变大自动换行,网页css中实现字符超出宽度自动换行和英语字符不断行的解决方法...相关推荐
- css中实现字符超出宽度自动换行和英语字符不断行的解决方法
为了使英语字符不断开,我在显示内容的style是text-align:justify; text-justify:inter-ideograph.可是这样子在后台添加内容时,如果不是键盘输入的,而是c ...
- css中text文字超出宽度省略号显示并鼠标悬停显示剩余全部:
代码:记得写在渲染文字的那个标签class上: display: -webkit-box;overflow: hidden;text-overflow: ellipsis;word-wrap: bre ...
- Html字母变大的代码,css鼠标选中字体变大 div css鼠标悬停超链接的文字变大
css鼠标选中字体变大 css鼠标悬停超链接的文字变大 CSS布局鼠标悬停在超链接上字体变大,css实现鼠标经过锚文本文字时改变字体大小篇. 实现这一效果需要的是:hover伪类设置需要字体. 鼠标选 ...
- 安卓在切换到横屏后,字体变大
安卓在切换到横屏后,字体变大 在清单文件中(AndroidManifest.xml) 切换横屏 android:screenOrientation="landscape" 或者 在 ...
- html语言字体如何变大,怎么把网页的字变大_怎么让html字体变大?
如何更改网页显示字体的大小 1.打开浏览器,浏览器右上角点击三横按钮. 怎样把网页上的字显示变大 打开IE---工具---选项---辅助功能---选:不使用网页中指定的文字大小.就可以完全使用&quo ...
- html语言把字变大,css怎么让字体变大?
css可以通过font-size属性让字体变大,font-size属性可设置字体的尺寸.所有主流浏览器都支持font-size属性. font-size 属性可设置字体的尺寸. 说明 该属性设置元素的 ...
- html一键使网页字体变大,网页字体变大了怎么办
网页字体变大了导致重叠怎么办?不是缩放的原因 我的电脑网页字体变大了怎么办 按住CTRL在滚动鼠标滚轮...或者在网页右下角有个调整的,,百分之多少的..或者CTRL+ 或者CTRL- 都可以调整 原 ...
- CSS: 首字母字体变大时下划线不对齐的解决方法
昨天在写2017年百度ife任务六的时候遇到了一个排版问题,需要首字母字体变大的同时,下划线对齐. 首先使用了 ::first-letter伪元素的选择器,将字体变大后,发现下划线没法对齐,代码如下: ...
- 将混淆矩阵中的数字字体变大--python
如何将混淆矩阵中的字体大小变大 # p2 = bestRF.predict(X_test) # 测试集的预测值 test_confusion = confusion_matrix(y_test, an ...
最新文章
- window下git的使用
- FZU 1889 龟兔赛跑
- 中国移动互联网趋势报告:教育、金融类App留存率更高
- sql加上唯一索引后批量插入_阿里大佬总结的52条SQL语句性能优化策略,建议收藏...
- Redis 实用技术——事务
- 【今日CV 计算机视觉论文速览 第131期】Mon, 17 Jun 2019
- python实现链表的删除_B站上的免费Python课程
- 基础篇:3.3.2)压铸件-材料选择
- jquery 检测div宽度变化_jquery判断浏览器宽度小于指定值改变div样式
- Hadoop安装目录
- IDEA jsp中文乱码
- Android手机投屏后没有声音,安卓手机镜像投屏没有声音解决办法
- PCB layout的基本原则
- 图像分割(语义分割)的局限以及解决方法
- python 百度ai json解析_百度AI接口调用
- spec文件知识整理
- Visual Studio 2019配置OpenGL环境
- 计算机平面设计教材,《计算机平面设计软件应用——全国中等职业技术学校计算机教材》低价购书_教材教辅考试_孔网...
- 全球2018OpenStack用户调查报告亮点一览
- java多线程与并发原理
热门文章
- [codility]Min-abs-sum
- Schema evolution in Avro, Protocol Buffers and Thrift
- [导入]画带阴影效果的文字
- mysql数据库的数据类型转换_MySQL 和Server 2000 数据库中数据类型的转换
- RabbitMQ六种队列模式-发布订阅模式
- SVN 405错误
- table合并单元格宽度自适应
- java中的基本数据类型和运算符_【Java基础】基本数据类型和运算符
- Vue 之 slot(插槽)
- 排序之选择排序:简单选择+堆排序