css实现文字过长显示省略号的方法
<div class="title">当对象内文本溢出时显示省略标记</div>
这是一个例子,其实我们只需要显示如下长度:
css实现网页中文字过长截取...
title class应该这样写:
.title{ width:300px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
说明:
1、宽度一定要设置,可以根据实际需求调整。
2、white-space:nowrap是禁止文字折行。
3、text-overflow表示当文本溢出时是否显示省略标记,有两个值:
clip:不显示省略标记(...),而是简单的裁切。
ellipsis:当对象内文本溢出时显示省略标记(...)
4、overflow:hidden表示溢出内容为隐藏。
css实现文字过长显示省略号的方法的更多相关文章
- CSS样式 解决文字过长显示省略号问题
一.CSS样式 解决文字过长显示省略号问题 1.一般样式 一般 css 样式,当宽度不够时,可能会出现换行的效果.这样的效果在某些时候肯定是不行的,可以修改 css 样式来解决这个问题. <!D ...
- css 控制文字超出部分显示省略号
该文章转自:http://www.daqianduan.com/6179.html 如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来,当然还需要加宽 ...
- css 控制文字超出时显示省略号
不多说,直接看代码吧: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- CSS控制 文字超出部分显示省略号
实现单行文本的溢出显示省略号, (需要加宽度width属来兼容部分浏览) <p style="width: 100px;overflow: hidden;white-space: no ...
- css 实现文字过长变成省略号(包含单行的and多行的)
单行的比较简单 但是必须条件同时满足 <DIV STYLE="width: 120px; height: 50px; border: 1px solid blue;overflow: ...
- css设置文字多余部分显示省略号
如果只显示一行,则可以使用以下方法: overflow: hidden; text-overflow:ellipsis; white-space: nowrap; 如果需要显示多行,在需要设置的元素s ...
- css实现文字内容超出显示省略号
white-space: nowrap; /* 内容超出容器宽度时强制不换行 */ overflow: hidden; /* 内容超出容器时隐藏超出部分 */ text-overflow: ellip ...
- css对于文字过长加省略号
overflow: hiddentext-overflow: ellipsiswhite-space: nowrap
- css设置文字超出部分显示省略号。。。
兼容IE/Firefox/Chrome display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
随机推荐
- 第一个javaWeb项目-注册界面
基本功能: 实现信息录入到数据库和信息规范检查 题目要求: 项目目录: 网页界面: 程序源码: package Dao; import java.sql.Connection; import java ...
- Java入门 - 语言基础 - 03.基础语法
原文地址:http://www.work100.net/training/java-basic-syntax.html 更多教程:光束云 - 免费课程 基础语法 序号 文内章节 视频 1 第一个Jav ...
- Spring Cloud学习之-什么是Spring Cloud?
SpringCloud 什么是微服务? 要想学习微服务,首先需要知道什么是微服务?为什么会有微服务?相信看完架构的发展史读者就会明白 架构发展史 单体应用架构 如图所示:将所有的模块,所有内容(页面. ...
- Java中SMB的应用
目录 SMB 服务操作 Ⅰ SMB简介 Ⅱ SMB配置 2.1 Windows SMB Ⅲ 添加SMB依赖 Ⅳ 路径格式 Ⅴ 操作共享 Ⅵ 登录验证 SMB 服务操作 Ⅰ SMB简介 SMB(全称 ...
- Docker windows nano server容器中安装ssh实现远程登录管理
[问题] 使用ServiceMonitor.exe作为前台进程运行起来的容器无法attach. 无法远程连接到运行中的容器中进行管理. [解决方法] 在container中新建管理员用户,通过SSH实 ...
- springboot2.x整合spring-data-jpa的问题
今天使用springboot整合spring-data-jpa遇到一些问题,直接使用JpaRepository的getOne()方法是会报错的.报错信息为:org.hibernate.LazyInit ...
- windows 删除无用服务
Windows中无用的服务怎么删除? Windows服务也称为Windows Service,它是Windows操作系统和Windows网络的基础,属于系统核心的一部分,它支持着整个Windows的各 ...
- 多线程之CountDownLatch的用法及原理笔记
前言-CountDownLatch是什么? CountDownLatch是具有synchronized机制的一个工具,目的是让一个或者多个线程等待,直到其他线程的一系列操作完成. CountDownL ...
- YUM安装软件提示[Errno 14] curl#6 - "Could not resolve host: mirrors.cloud.aliyuncs.com; 未知的错误"
报错如下: 翻译过来就是 所以问题很简单: 第一种情况:本地DNS服务错误 第二种情况:远程主机挂了 第三种情况:远程主机地址配置错误 第一种解决方法:换DNS 首先验证一下是不是本地DNS错误 从上 ...
- FFMPEG学习----使用SDL播放PCM数据
参考雷神的代码: /** * 最简单的SDL2播放音频的例子(SDL2播放PCM) * Simplest Audio Play SDL2 (SDL2 play PCM) * * 本程序使用SDL2播放 ...