css实现字母或数字强制换行
//换行
white-space:normal;
word-break:break-all;
word-wrap: break-word;
相关属性
white-space: normal|pre|nowrap|pre-wrap|pre-line|inherit;
white-space 属性设置如何处理元素内的空白
normal 默认。空白会被浏览器忽略。
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 pre 标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 br 标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。 word-wrap: normal|break-word;
word-wrap 属性用来标明是否允许浏览器在单词内进行断句,这是为了防止当一个字符串太长而找不到它的自然断句点时产生溢出现象。
normal: 只在允许的断字点换行(浏览器保持默认处理)
break-word:在长单词或URL地址内部进行换行
word-break: normal|break-all|keep-all; word-break 属性用来标明怎么样进行单词内的断句。
normal:使用浏览器默认的换行规则。
break-all:允许再单词内换行
keep-all:只能在半角空格或连字符处换行 、单行文本溢出显示省略号(…) text-overflow:ellipsis-----部分浏览器还需要加宽度width属性 overflow:hidden;text-overflow:ellipsis;white-space:nowrap; 、多行文本溢出显示省略号,WebKit浏览器或移动端的页面 overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:;-webkit-box-orient:vertical;
css实现字母或数字强制换行的更多相关文章
- CSS - 内联元素span 强制换行失败的可能原因
在CSS中,标签span 强制换行失败:(使用display:block) 可能原因:float:left or float:right
- css英文字符或者数字不换行的问题
table-layout:fixed; word-break: break-all; overflow:hidden;
- CSS 强制换行和禁止换行学习
强制换行 1.word-break: break-all; 只对英文起作用,以字母作为换行依据. 2.word-wrap: break-word; 只对英文起作 ...
- CSS 中的强制换行和禁止换行
强制换行 1.word-break: break-all; 只对英文起作用,以字母作为换行依据. 2.word-wrap: break-word; 只对英文起作 ...
- odoo开发笔记:前端显示强制换行
未调整之前:客户信息显示不全 调整后实现效果: 补充CSS知识: 一.强制换行 word-break: break-all; 只对英文起作用,以字母作为换行依据. word-wrap: break-w ...
- table内容强制换行
为防止文字过长而撑坏表格,一般我们需要通过css使td中内容强制换行.分别给table和td加一条样式即可实现: <meta charset="utf-8"> < ...
- CSS样式自动换行(强制换行)与强制不换行
自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法 对于div,p等块级元素,正常文字的换行(亚洲文字和非亚洲文字)元素拥 ...
- css文本超出部分省略号&CSS强制换行总结
word-break:break-all单词截断自动换行 word-break:break-all 例如div宽200px,它的内容就会到200px自动换行,如果该行末端有个英文单词很长(congra ...
- css实现强制不换行/自动换行/强制换行
在我们日常的编码中经常会遇到这段文字不可以换行,或者自动换行的需求.虽然这个功能在我们平时很常见但是我相信大家一定不会可以的去记住它吧(至少小月是很懒惰的从来是用什么查什么 ♦ 嘻嘻...).今天我们 ...
随机推荐
- "Access denied for user 'root@localhost' 试一下你的mysql是不是用任何密码都可以登录,如果是的话这里
https://blog.csdn.net/light_breeze/article/details/82070222 花了三小时...竟然是因为这个
- [kuangbin带你飞]专题一 简单搜索 - K - 迷宫问题
#include<iostream> #include<cstdio> #include<cstring> #include<algorithm> #i ...
- iBATIS存储过程
使用iBATIS配置来调用存储过程.为了理解这一章,首先需要了解我们是如何在MySQL中创建一个存储过程. 在继续对本章学习之前,可以通过MySQL存储过程. 我们已经在MySQL下有EMPLOYEE ...
- 消息中间件kafka学习记录
目录 1. 概述 2. 环境准备 3. 命令行常用命令 4. java api实现 1. 概述 Apache Kafka是一个分布式消息系统,凭借其优异的特性而被广泛使用. 高性能:O(1)复杂度消息 ...
- Java常用文件下载与查找的URL
Java JDK: http://www.oracle.com/technetwork/java/javase/downloads/index.html Tomcat: http://tomcat.a ...
- MySQL数据库之DQL(数据查询语言)
1.MySQL之DQL查询AS CONCAT LIKE的使用 (1)select 列名1,列名2,...... from 表名 [where 条件] 查询所有字段用*,不带where条件的话,就会把表 ...
- JS去重算法
1.遍历数组法 它是最简单的数组去重方法(indexOf方法) 实现思路:新建一个数组,遍历去要重的数组,当值不在新数组的时候(indexOf为-1)就加入该新数组中: var arr=[2,8,5, ...
- WannaCry结束了? 安专家注册域名掐断病毒传播
腾讯科技讯,(韩依民) 5 月 13 日,席卷全球的勒索病毒 WannaCry(也被称作 WanaCrypt 或 WCry),在今日晚间被互联网安全人员找到阻止其传播的方法. 据北京云纵信息技术有限公 ...
- PAT甲级——A1132 Cut Integer
Cutting an integer means to cut a K digits lone integer Z into two integers of (K/2) digits long int ...
- dockerfile自动创建docker镜像
特点:类似于ansible 剧本,大小几kb 而,手动做的镜像,要几百M,甚至上G ,传输不方便 dockerfile 支持自定义容器的初始命令 dockerfile只要组成部分: 基础镜像信息 FR ...