【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 ...
随机推荐
- NEU 1497 Kid and Ants 思路 难度:0
问题 I: Kid and Ants 时间限制: 1 Sec 内存限制: 128 MB提交: 42 解决: 33[提交][状态][讨论版] 题目描述 Kid likes interest ques ...
- linux oracle11g 数据 导入到10g数据库
说明: 原用户名和密码:test/test 目标用户名和密码:test01/test 11G 服务器: 1.创建dmp文件存储目录 # mkdir -p /tmp/backup # sqlplus ...
- 初次使用VCS仿真软件
由于刚开始接触VCS,对于VCS不是太了解,在网上找了很多的资料终于遇到了一个相对比较初级的入门资料,这个资料是以一个简单的4位加法器为例来介绍vcs的用法的,比较好入门,这个文章的地址如下: htt ...
- APUE学习笔记——3.10文件共享
基本概念 内核使用3个数据结构描述一个打开的文件:进程表.文件表.V节点表 首先了解3种数据结构的概念 1 进程表 每一个进程有一个进程表.进程表里是一组打开的文件描述符,如标 ...
- Python中字符的练习
一.重复的单词:此处认为分隔符为空格:个整数-]): list.append(random.randint(, ))for i in list: d[i]=list.count(i)print d
- [置顶]
Android Glide传Context引发的非法参数异常那些小坑
今天中午调试一直出现nullContext 我的代码如下 解决办法: Glide.with(mContext) .load(mdl.getImage()) .centerCrop() .placeho ...
- 通过摄像机视频设备或者流媒体服务器SDK获取到数据转换成RTMP流实现网页/手机微信播放
写这篇博客主要是为了给新入门的流媒体开发者解惑,现在看到各种开发者的需求:网页播放RTSP摄像机.微信播放RTSP摄像机.网页播放摄像机SDK输出的视频流.网页播放第三方流媒体平台输出的视频流.包括G ...
- Mac OS 升级到10.12问题 Android ADT 下载SDK问题 https://dl-ssl.google.com refused...
缘由: 更新sdk,遇到了更新下载失败问题: Fetching https://dl-ssl.google.com/android/repository/addons_list-2.xml Fetch ...
- java android 读写西门子PLC数据,包含S7协议和Fetch/Write协议,s7支持200smart,300PLC,1200PLC,1500PLC
本文将使用一个gitHub开源的组件技术来读写西门子plc数据,使用的是基于以太网的TCP/IP实现,不需要额外的组件,读取操作只要放到后台线程就不会卡死线程,本组件支持超级方便的高性能读写操作 gi ...
- python爬虫入门(1)-urllib模块
作用:用于读取来自网上(服务器上)的数据 基本方法:urllib.request.urlopen(url,data=None,[]timeout]*,cafile=None,cadefault=F ...