在显示一行文字时,如果容器太小,为了显示出省略字符,可以使用

ellipsis
{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}

这三个属性缺一不可。

在实际项目中,telerik有一个控件Grid,当其绑定数据时,使用:

columns.Bound(a => a.Content).Title("内容").HtmlAttributes(new { @class = "ellipsis" });

可以让其灵活根据宽度自由伸缩。

省略文字的css的更多相关文章

  1. 文字闪烁效果 CSS + HTML

    文字闪烁效果 CSS 写在前面 好好学习,天天向上! 效果图 绝美的效果 实现过程 先给没字体添加一些普通的样式,颜色设置为透明 给文字设置一个动画效果,通过text-shadow属性来实现变亮的效果 ...

  2. 文字分列 CSS属性

    column 这里有一系列新的CSS属性,可以帮助你很轻松的实现文字的多列布局.让我们瞧瞧: .three-column { padding: 1em; -moz-column-count: 3; - ...

  3. 文本框文字垂直居中 CSS

    <html> <head> <style type="text/css"> #text { height:20px; vertical-alig ...

  4. 文字描边css

    -webkit-text-stroke: 3.3px #2A75BF; -webkit-text-fill-color:#fff; 该方法在安卓端貌似不支持,显示为一团 或: -webkit-text ...

  5. android:ellipsize省略文字用法(转载)

    转自:http://zhangkun716717-126-com.iteye.com/blog/864989 TextView及其子类,当字符内容太长显示不下时可以省略号代替未显示的字符:省略号可以在 ...

  6. 点亮文字(CSS)

    html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8& ...

  7. 文本溢出省略解决笔记css

    text-overflow:ellipsis; overflow:hidden; white-space:nowrap; *white-space:nowrap;

  8. 两边是线 ,中间是文字 的CSS写法 而且还是自适应的

  9. 一段隐藏文字的css代码,记录下

    <span style="width:1px; height:1px; color:#fff; outline-width:hidden; overflow:hidden; displ ...

随机推荐

  1. Shell编程基础教程7--脚本参数的传递

    7.脚本参数的传递    7.1.shift命令        简介:            shift n        每次将参数位置向左偏移n位        例子 #!/bin/bash us ...

  2. Asyncio中的Task管理

    #!/usr/bin/env python # -*- coding: utf-8 -*- import asyncio import datetime import time from random ...

  3. SQL的一切常用函数展示

    练习了一下, 用时再慢慢看吧. SHOW WARNINGS; SELECT quote(text_fld) FROM string_tbl; ), 'n'); SELECT ASCII('ö'); S ...

  4. MVP社区巡讲照片集

    今天MVP社区巡讲在北京利星行微软大厦连同SQL PASS社区合办了一次线下活动,这次互动汇集了在北京大多数的微软MVP,他们都是微软认可的有着各微软产品和技术特长的技术专家,无论是MVP社区巡讲还是 ...

  5. <转>Oracle SQL性能优化

    原文链接:http://www.cnblogs.com/rootq/archive/2008/11/17/1334727.html (1)      选择最有效率的表名顺序(只在基于规则的优化器中有效 ...

  6. Installing Hadoop on Mac OSX Yosemite Tutorial Part 1.

    Installing Hadoop on Mac OSX Yosemite Tutorial Part 1. September 23, 2014 Marek 68 Comments Install ...

  7. angularjs实战

    1.指令  transclude 保留原来的内容 replace 去掉<my-directive>指令 <script src="http://apps.bdimg.com ...

  8. csc.rsp Invent by Microshaoft

    # This file contains command-line options that the C# # command line compiler (CSC) will process as ...

  9. 关于MFC OpenGL环境配置的一点总结

    复制include时要小心..看vs给你load哪一个..名字一样..东西可不一定一样哦 http://www.cppblog.com/wicbnu/archive/2010/09/30/128123 ...

  10. apk签名(不打包)

    apk提交给应用市场加固后,需要重新签名 签名工具:360签名 下载地址:http://yunpan.cn/cm8GqVWL7Y8Eh 签名步骤:http://jiagu.360.cn/qcms/he ...