zoukankan      html  css  js  c++  java
  • 溢出文本用“...”代替

    之前一直尝试用但是总出不来效果,今天写代码又用这个,发现自己用错地方了,(⊙﹏⊙)b.....

    先上正确代码

     1 <!DOCTYPE html>
     2 <html>
     3 <head>
     4     <meta charset="utf-8">
     5     <title>text-overflow: ellipsis;</title>
     6 </head>
     7 <style>
     8     .text-overflow {
     9         display: inline-block;
    10         white-space: nowrap;
    11         overflow: hidden;
    12         text-overflow: ellipsis;
    13     }
    14     a{
    15     width:110px;    
    16     }
    17 </style>
    18 <body>
    19 <a href="#" class="text-overflow">测试文字能否被截取</a><br>
    20 <b class="text-overflow" style="100px;">测试文字能否被截取</b>
    21 </body>
    22 </html>

    今天是将新闻列表中的溢出文本用“...”代替,第一次发现自己将css样式写到了ul标签中,后来发现写进了li标签中都不能用,最后换到a标签中就可以了,原来作用的是内部的a标签,真马虎

    写的html样式是:

    <ul><li><a>我是内容</a></li></ul>

  • 相关阅读:
    LRu Cache算法原理
    c# 哈希表
    c# 获取二维数组的行数和列数
    Linq
    DataTable使用
    Wpf学习
    数据库配置
    js 数字保留两位小树
    平面数据转换为树形结构
    mysql操作
  • 原文地址:https://www.cnblogs.com/lpshan/p/4461412.html
Copyright © 2011-2022 走看看