【CSS】文字超出显示省略号&连续字符换行
方法1.多行控制(css3)
.text {
width: 100%;
word-break: break-all;
display: -webkit-box;
-webkit-line-clamp:;
-webkit-box-orient: vertical;
overflow: hidden;
}
line-clamp:几行以后显示省略号(例子为2行)
方法2.单行定宽
.text-ellipsis {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
应用在block级的元素上
连续字符换行问题
p{
word-break:break-all;
word-wrap:break-word;
}
【CSS】文字超出显示省略号&连续字符换行的更多相关文章
- css文字超出显示省略号
单号: white-space:nowrap; overflow:hidden; text-overflow:ellipsis; 多行: word-break: break-all; text-ove ...
- CSS文字过多显示省略号
CSS文字过多显示省略号 /*-webkit-line-clamp用来限制在一个块元素显示的文本的行数*/ .dot1{ width: 100%; display: -webkit-box; -web ...
- css文字溢出显示省略号
1.单行文字溢出显示省略号. overflow: hidden; text-overflow: ellipsis; white-space: nowrap;//文本不换行 2.多行文本溢出显示省略号. ...
- css内容超出显示省略号
CSS实现单行.溢出显示省略号(…) 把要设置的显示省略号的标签,加上以下的属性 overflow: hidden; /*超出不显示*/ text-overflow: ellipsis;/* 超出内容 ...
- 用户界面样式(cursor,resize,vertical-align,outline,文字超出显示省略号)
1. 鼠标样式 cursor default: 小白(箭头)默认 pointer:小手 move:移动 text:文本 not-allowed:禁止 2. 轮廓线(表单外发光)outline 给表单添 ...
- CSS解决文字超出显示省略号问题
超出一行 white-space: nowrap; overflow: hidden; text-overflow: ellipsis; 超出多行 overflow: hidden; text-ove ...
- table表格中文字超出显示省略号
第一步: table {table-layout:fixed:}列宽由表格宽度和列宽度设定,不随文字多少变化 第二步: td { white-space:nowrap;/*文本不会换行,文本会在在同一 ...
- table td 文字超出显示省略号
.autocut { width:250px; overflow:hidden; white-space:nowrap; text-overflow:ellip ...
- css文字超出变省略号...
<style>.text1 { width:200px; overflow:hidden; text-overflow:ellipsis; -o-text-over ...
随机推荐
- IEnumerable.Select和SelectMany的区别
例子(一个人可以有多个手机) public class People { public string Name { get; set; } public List<Phone> Phone ...
- Linux下的ASLR(PIE)内存保护机制
1.1 Linux下的ASLR内存保护机制 1.1.1 Linux下的ASLR工作原理 工作原理与window下的aslr类似 1.1.2 Linux下利用内存地址泄露绕过ASLR ⑴. ...
- Vue(1) : Vue项目入门
1.先安装nodejs环境 查看官文 2.切换到国内源 npm install -g cnpm –registry=https://registry.npm.taobao.org 执行成功后,执行如下 ...
- HDU 2273
http://acm.hdu.edu.cn/showproblem.php?pid=2273 N辆车排队过马路,不能相撞,问最短时间 ans=车的总长度/最小速度 #include <iostr ...
- 如何去访问win8系统的共享文件夹
关于共享,看过不少的贴子,觉得搞得很复杂.我看起来也很头痛.晕头转向的.其实我们作为家庭用户来说,不想搞得那么复杂,我们只要能做到能够从一台电脑访问另一台电脑的共享文件夹就可以了,这样我们就可以任意从 ...
- css3公共样式
温馨提示:一下css封装,建议按需使用,否则会造成很大的代码冗余,且很多样式会造成不符合预期的效果,建议合理使用 <a href="https://meyerweb.com/eric/ ...
- 【剑指offer】输入一颗二叉树的根节点,求二叉树的深度,C++实现
原创博文,转载请注明出处! # 题目 # 举例 下图二叉树的深度为4,最长路径为1-2-5-7. # 思路(递归) 如果一个树只有一个节点,它的深度为1: 如果根节点只有左子 ...
- Sublime Text 2 设置文件详解(转)
Sublime Text 2是那种让人会一眼就爱上的编辑器,不仅GUI让人眼前一亮,功能更是没的说,拓展性目前来说也完全够用了,网上介绍软件的文章和推荐插件的文章也不少,而且很不错,大家可以去找找自己 ...
- 每天一个linux命令(文件上传下载文件操作):【转载】gzip命令
减少文件大小有两个明显的好处,一是可以减少存储空间,二是通过网络传输文件时,可以减少传输的时间.gzip是在Linux系统中经常使用的一个对文件进行压缩和解压缩的命令,既方便又好用.gzip不仅可以用 ...
- bzoj 4573 大森林
bzoj 4573 大森林 由于树上路径是唯一的,查询合法的两个点间路径长度显然与其他加点操作无关,所以可以离线处理,将所有的查询放在加点后. 这样我们可以对每棵树都在上颗树的基础上处理好形态后,处理 ...