分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

css 英文换行 css(word-wrap/break)使纯英文数字自动换行

发布时间:2023-09-06 01:51责任编辑:熊小新关键词:word

问题

当一个定义了宽度的块状元素中填充的全部为纯英文或者纯数字的时候,在IE和FF中都会撑大容器,不会自动换行并且当数字或者英文中带有汉字时,会从汉字处换行,而纯汉字却可以自动换行。这个问题如何解决?先来认识一下两位主角word-wrap和word-break 

解决方法

可以在CSS中加入 
word-wrap:break-word; 
word-break:break-all; 

word-wrap用来控制换行 
两种取值: 
(1)normal 
(2)break-word(此值用来强制换行,内容将在边界内换行,中文没有任何问题,英文语句也没问题。但是对于长串的英文,就不起作用。) 

word-break用来控制断词 
三种取值: 
(1)normal 
(2)break-all(是断开单词。在单词到边界时,下个字母自动到下一行。主要解决了长串英文的问题。) 
(3)keep-all(是指Chinese, Japanese, and Korean不断词,一句话一行,可以用来排列古诗哟~) 

css 英文换行 css(word-wrap/break)使纯英文数字自动换行

原文地址:https://www.cnblogs.com/mashixun/p/8966601.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved