在css的实际运用中，可使用overflow属性来实现多行文本溢出隐藏，只需要给文本元素添加“overflow: hidden;”样式即可。overflow属性规定当内容溢出元素框时发生的事情，当值设置为“hidden”时，会设置溢出部分不可见。

图片[1]-通过css代码怎么实现多行文字文本溢出隐藏-AA源码网 | 源码收藏

本教程测试环境：

windows7系统
CSS3&&HTML5版
Dell G3电脑

教程与讲解

在css中，可使用overflow属性来实现多行文本溢出隐藏，overflow属性规定当内容溢出元素框时发生的事情。

这个属性定义溢出元素内容区的内容会如何处理。属性值：

hidden：内容会被修剪，并且其余内容是不可见的。
scroll：内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto：如果内容被修剪，则浏览器会显示滚动条以便查看其余的内容。

如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。

示例：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <style type="text/css">
            div {
                background-color: pink;
                width: 150px;
                height: 150px;
                overflow: hidden
            }
        </style>
    </head>
    <body>
    <p>如果元素中的内容超出了给定的宽度和高度属性，overflow 属性可以确定是否显示滚动条等行为。</p>
    <div>
    这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，
    用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。
    默认值是 visible。
    </div>
    </body>
</html>

温馨提示：若内容/图片/下载链接失效，请在下方留言或登录后私信站长。

本文结束END

本网站名称：AA源码网
默认解压密码：aaym.net
①本站所有资源免费，收取的费用仅为抵扣人工测试和服务器日常维护带来的消耗成本，请须知。
②因源码、模板、插件等程序具有可复制性，一经出售概不退款。
③本站部分资源来源网络或者用户投稿，如有侵权请联系删除（aaym@foxmail.com）
④本站资源仅用于个人学习和交流，如用于商业使用请选择正版程序。使用非正版程序须在24小时内卸载删除。
➣详细的版权声明请点击文章版权声明查看。
**下载/阅读均默认代表您已详细阅读版权声明并同意承担可能造成的所有损失及后果！

THE END