每天CSS学习之text-overflow
text-overflow是CSS3的一个属性,其作用是当文本溢出包含它的元素时,应该裁剪还是将多余的字符用省略号来表示。
该属性一般和overflow:hidden属性一起使用。
text-overflow: clip|ellipsis|string
1、clip:修剪文本。即将溢出的文本裁剪掉。如以下例子,如果需要显示This is an Action,则:
white-space:nowrap;
text-overflow:clip;
overflow:hidden;
结果:

2、ellipsis: 当文本溢出时,用省略号代替溢出的文本。如:
white-space:nowrap;
text-overflow:ellipsis;
overflow:hidden;
结果:

每天CSS学习之text-overflow的更多相关文章
- CSS学习笔记
CSS学习笔记 2016年12月15日整理 CSS基础 Chapter1 在console输入escape("宋体") ENTER 就会出现unicode编码 显示"%u ...
- css学习归纳总结(三) 转
原文地址:css学习归纳总结(三) 为文档添加样式的三种方法 行内样式 行内样式是写在HTML标签的style属性里的,比如: <p style="font-size: 12px;fo ...
- css学习归纳总结(二) 转
原文地址:css学习归纳总结(二) 标签与元素 <p>标签和p元素有什么区别呢?大多数时候他们表示的是同一样东西,但仍有细微的区别.<p>.<div>等指的是HTM ...
- css学习归纳总结
来源于:trigkit4 css学习归纳总结(一) 选择器的分组 CSS选择器分为 1.群组选择器 如:p, body, img, div{} 2.兄弟选择器 如:p + p { color:#f00 ...
- html+css学习总结
HTML与css学习总结 一:html概念 1. html是一种描述网页的语言,并不是计算机语言这要分清楚:标记语言是运用一套标记标签描述网页的: 注意点: ①标签字母都要小写,标签一般都是成对出现, ...
- HTML, CSS学习笔记(完整版)
第一章 div布局 前几课内容 .htm是早期的后缀.由于那时仅仅能支持长度为3的后缀.因此html与htm是一样的. shtml是server先处理然后再交给浏览器处理 #HTML小知识#之#XHT ...
- CSS学习笔记:溢出文本省略(text-overflow)
原文:CSS学习笔记:溢出文本省略(text-overflow) 在CSS3中,text-overflow属性的基本语法如下: clip:表示不显示省略文本,简单的裁切. ellipsis:表示对象文 ...
- CSS学习笔记08 浮动
从CSS学习笔记05 display属性一文中,我们知道div是块元素,会独占一行,即使div的宽度很小,像下面这样 应用display属性的inline属性可以让div与div共享一行,除了这种方法 ...
- CSS学习笔记09 简单理解BFC
引子 在讲BFC之前,先来看看一个例子 <!DOCTYPE html> <html lang="en"> <head> <meta cha ...
- HTML与CSS学习记录
title: HTML与CSS学习记录 toc: true date: 2018-09-10 14:04:59 <HTML与CSS进阶教程读书笔记> HTML基础知识 HTML与XHTML ...
随机推荐
- eslint简单的规范
module.exports = { root: true, parser: 'babel-eslint', parserOptions: { sourceType: 'module' }, // h ...
- HTML5-用canvas画布rotate字体旋转(中国象棋棋谱)。
一开始我们老师安排我做这个作业,在这个作业我遇到了一个很重大的问题就是,文字旋转这么旋转,我查了很多资料. 1发现绘画正方形,使他正方形中心原点旋转非常容易理解.(我相信这个很多人看一下都会懂,) 1 ...
- R中的高效批量处理函数(lapply sapply apply tapply mapply)(转)
转自:http://blog.csdn.net/wa2003/article/details/45887055 R语言提供了批量处理函数,可以循环遍历某个集合内的所有或部分元素,以简化操作. 这些函数 ...
- English trip V1 - B 16. Giving Reasons 提供个人信息 Teacher:Lamb Key: Why/Because
In this lesson you will learn how to give reasons for something you've done. 课上内容(Lesson) Why do peo ...
- Python自学:第二章 数字 整数
>>>2 + 3 5 >>>3 - 2 1 >>>3 * 2 6 >>>3 / 2 1.5
- ERROR org.redisson.client.handler.CommandDecoder - Unable to decode data. channel
一.异常出现的场景 某一天下午,测试突然跑过来说,IOS系统APP访问500,Android没问题.我的第一反应是那就奇怪了,调的接口都是一样的,莫非和系统有关系.而且这个错误重启服务后,过一段时间才 ...
- vue 点击一个div,使input获得焦点
<div class="inputMessage" @click="inputMessage">输入留言</div> <input ...
- 原生JS实现瀑布流布局
瀑布流,又称瀑布流式布局.是比较流行的一种网站页面布局,视觉表现为参差不齐的多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部. 1.首先瀑布流所有的图片应该保持宽度一致,高 ...
- CentOS6.8环境下搭建yum网络仓库
CentOS6.8环境下搭建yum网络仓库 本文利用ftp服务,在CentOS6.8系统下搭建一个yum仓库,然后用另一台虚拟机访问该仓库.并安装程序包 安装ftp服务 查询ftp服务是否安装 [ro ...
- array_multisort以及php中的排序函数
1. array_multisort(array_column($arr, $key), SORT_DESC, $arr); // 根据二维数组中的某一列对数组进行增序或者降序排列 什么是关联数组呢? ...