zoukankan      html  css  js  c++  java
  • CSS3实现单行、多行文本溢出(省略号的形式出现)

    <!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style type="text/css">
                p {
                    width: 100px;
                    height: 40px;
                    line-height: 40px;
                    text-align: center;
                    margin: 0 auto;
                    background: #ccc;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                }
                
                div {
                    display: block;
                    display: -webkit-box;
                    max-width: 300px;
                    height: 109.2px;
                    margin: 10px auto;
                    font-size: 26px;
                    line-height: 1.4;
                    -webkit-line-clamp: 3;
                    -webkit-box-orient: vertical;
                    overflow: hidden;
                    text-overflow: ellipsis;
                }
            </style>
        </head>
        <body>
            <p>文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出</p>
            <div>文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出文本溢出</div>
        </body>
    
    </html>

  • 相关阅读:
    Python2.7-math, cmath
    Python2.7-pprint
    Python2.7-copy
    Python2.7-weakref
    Python2.7-Queue
    Python2.7-sched
    Python2.7-array
    Python2.7-bisect
    搜索专题:Balloons
    【洛谷P4460】解锁屏幕【状压dp】
  • 原文地址:https://www.cnblogs.com/lhl66/p/9105196.html
Copyright © 2011-2022 走看看