CSS3省略标记text-overflow


   作者蓝石榴    由lan16转载自蓝石榴    更新于2016-09-15 17:48    已被浏览254次

1.使用方法:
  text-overflow用来设置是否使用一个省略标记(···)标示对象内文本的溢出,语法如下:
  text-overflow:ellipsis;
  注:text-overflow只是用来说明文字溢出时用什么方式显示,要实现溢出时产生省略号的效果,还须如下代码:
  .demo{
    overflow:hidden;/*溢出内容为隐藏*/
    white-space:nowrap;/*定义强制文本在一行内显示*/
  }

2.代码示例:
  .demo{
    text-overflow:ellipsis;
    overflow:hidden;
    white-space:nowrap;
    width:400px;
    padding:10px;
    font:bold 45px/100% "楷体";
    background:#9da;
    text-shadow:4px 4px 0 #f3b
  }
  效果如下:
蓝石榴技术社区是超酷的IT学习平台

豫ICP备13022176号-2   鄂公网安备 42010602000416号   Copyright © 2013 - 2020 蓝石榴. All Rights Reserved  联系我 联系我 蓝石榴技术社区