css 英文带点,CSS 强制换行(带英文和数字时)_推酷RecCool的博客-程序员信息网

技术标签: css 英文带点  

对于div,p等块级元 素

正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行

html

id="wrap">正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义

gt;

css

#wrap{white-space:normal; width:200px; }

1.(IE浏览器)连续的英文字符和阿拉伯数字,使用word-wrap : break-word

;或者word-break:break-all;实现强制断行

#wrap{word-break:break-all; width:200px;}

或者

#wrap{word-wrap:break-word; width:200px;}

id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111

效果:可以实现换行

2.(Firefox浏览器)连续的英文字符和阿拉伯数字的断行,Firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或

者,给容器添加滚动条

#wrap{word-break:break-all; width:200px; overflow:auto;}

id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111

效果:容器正常,内容隐藏

对于table

1. (IE浏览器)使用 table-layout:fixed;强制table的宽度,多余内容隐藏

width="200">

abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss

效果:隐藏多余内容

2.(IE浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break :

break-all;或者word-wrap : break-word ;换行

style="table-layout:fixed;">

abcdefghigklmnopqrstuvwxyz 1234567890abcdefghigklmnopqrstuvwxyz 1234567890

效果:可以换行

3. (IE浏览器)在td,th中嵌套div,p等采用上面提到的div,p的换行方法

4.(Firefox浏览器)使用

table-layout:fixed;强制table的宽度,内层td,th采用word-break :

break-all;或者word-wrap : break-word

;换行,使用overflow:hidden;隐藏超出内容,这里overflow:auto;无法起作用

width="200">

abcdefghigklmnopqrstuvwxyz1234567890abcdefghigklmnopqrstuvwxyz1234567890
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_35968185/article/details/119374679

智能推荐

读书笔记---《小强升职记》_人意丶的博客-程序员信息网_小强小说

世界上只有两种人:真的很忙的人,和假装很忙的人目录世界上只有两种人:真的很忙的人,和假装很忙的人第一章 时间去哪了第二章 无压工作第三章 遇到问题怎么办第四章 如何养成一个好习惯**第五章:如何让想法落地**第六章;建立高效办公区------------------《小强升职记》读书笔记第一章 时间去哪了确实很忙的人可以分为两种:会自我管理的人,不会自我管理的人陷入时间黑洞的原因:做事情...

分享我的Android蓝牙开源作品—HBluetooth__H_JY的博客-程序员信息网_android蓝牙开源框架

大家好,好久没来发博客了。本篇将跟大家分享我在github上的一个开源项目,是关于安卓蓝牙开发的封装,包含蓝牙设备的搜寻、连接、通信,支持经典蓝牙和低功耗蓝牙,语言版本有Java和Kotlin两个版本。其实说起来,这个项目早在2018年的时候就已经编写过一版了,只不过由于当时工作比较繁忙,搁置了很长一段时间,后面又没有去理会。直到今年换工作,有事没事看看github账户,偶然看到有一个开发者给我提了第一个issue,惊喜万分,提醒我应该重新拾起这个项目了,然后就重新优化了一下,更新至Github,并准

Android5.0+ 新Notification smallIcon_china_cqcone的博客-程序员信息网

  android5.0以上版本对Notification进行了改进,对于通知栏上的小图标不再支持五颜六色的png图像了,仅支持只有alpha通道灰度图。  可以使用photoshop创建此种图像:步骤一:新建幅背景内容透明的RGB图像,并用画笔勾勒出图标的形状,步骤二:切换到通道面板中新建一个通道(默认就为alpha通道),然后关闭RGB通道,勾选Alpha1通道,步骤三:点击菜单栏文件-导出p...

Mac为系统JDK安装webhook证书_横竖皆贰的博客-程序员信息网

//Windowskeytool-import-aliascacerts-keystore%java_home%\jre\lib\security\cacerts-fileC:\abc.cer-trustcacerts//Mackeytool-import-aliascacerts-keystore%java_home%/jre/lib/security/cacerts-file/Users/x..x/abc.cer-trustcacerts此时命令行会...

随便推点

解决jdk安装后出现 Error: could not open `E:\jdk\lib\amd64\jvm.cfg'_李自富的博客-程序员信息网

1.首先查看环境变量配置是否正确PATH环境的路径配置CLASSPATH环境的路径配置JAVA_HOME的环境路径配置具体可以看我的另一篇博客jdk1.8环境路径配置详解2.如环境配置没有问题,则按以下操作2.1找到C:\Program Files (x86)\Common Files\Oracle\Java有个\javapath_target_4033452文件夹,每个人可能不太...

mysql之mysql.sock文件_灬紫荆灬的博客-程序员信息网_mysql mysql.sock

Mysql有两种连接方式:(1)TCP/IP(2)socket对mysql.sock来说,其作用是程序与mysqlserver处于同一台机器,发起本地连接时可用。例如你无须定义连接host的具体IP得,只要为空或localhost就可以。在此种情况下,即使你改变mysql的外部port也是一样可能正常连接。因为你在my.ini中或my.cnf中改变端口后,mysql.sock是随每一次 mysql server启动生成的。已经根据你在更改完my.cnf后重启mysql时重新生成了一.

socket或pipe 一端断开; errno 104:connetction reset by peer的错误分析_持续努力的博客-程序员信息网_socket返回104

errno 104:connetction reset by peer的错误分析https://blog.csdn.net/alibo2008/article/details/45694845 errno = 104错误表明你在对一个对端socket已...

idea中使用Tomcat debug模式启动web项目突然异常缓慢_intomylife的博客-程序员信息网

做项目的时候重启Tomcat半天没成功,控制台也没报错重启idea,重启电脑都没有用...结果是因为程序中有断点标记在了Method Breakpoints上了希望能够帮助到你~over...

一行代码搞定你的QueryString!(原创)_sunfollowme的博客-程序员信息网

导读:   Web开发做得多了,总觉得是体力活,于是搞些代码让自己脱离无聊的Coding吧(是脱离“无聊的”Coding,不是脱离无聊的“Coding”)。      初级阶段   为每个QueryString写转换的代码,针对不同的类型,进行转换和错误处理。      中级阶段   写了一个函数,专门做转换(1.1里写的):   /// /// Convert query string

CSFramework---通信层(Communication)的实现_Ailsa Zhang的博客-程序员信息网

C/S 开发框架之通信层的实现CSFramework编写的主要目的是,为未来编写相应的服务器/客户端模式下的应用系统提供便利。也就是说,我们的CSFramework将完成最底层的相应工作,使得开发人员在使用此框架时,无需再编写底层操作的代码。最底层–通信层(Communication)的实现基于服务器端和客户端,双方之间需要进行信息的交互,也就是说,无论是服务器端还是客户端,都同时作为信息的...

推荐文章

热门文章

相关标签