网页设计时经常发生文本内容超出容器范围的问题,在内容较多时多采用分页效果,在内容较少时则采用一些普通的文本溢出处理。常见的文本溢出处理方式有:

      1.简单裁切

      2.简单隐藏

      3.隐藏并显示省略号

      4.使用滚动条

   div.hide{
    overflow:hidden; /*简单隐藏*/
  }

  div.scroll{
    overflow:scroll; /*使用滚动条*/
  }

  div.clip{
    border:1px solid;
    overflow:hidden;/*超出部分隐藏*/
    white-space: nowrap;/*强制在一行显示*/
    text-overflow:clip;/*裁切*/
  }

  div.elli{/*超出部分省略号*/
    overflow:hidden;/*超出部分隐藏*/
    white-space: nowrap;/*强制在一行显示*/
    text-overflow:ellipsis;/*使用省略号*/
  }

 

相关文章:

  • 2022-12-23
  • 2022-12-23
  • 2021-05-20
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2021-07-22
猜你喜欢
  • 2021-05-13
  • 2021-05-21
  • 2022-12-23
  • 2022-12-23
  • 2021-12-20
  • 2022-12-23
  • 2022-02-03
相关资源
相似解决方案