css设置超出隐藏的方法:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> *{margin: 0;padding: 0;} div{width:50px;height: 50px;background: red;} p{ /*关键代码*/ overflow:hidden; white-space:nowrap; text-overflow:ellipsis; } </style> </head> <body> <div> <p>2222222222222</p> </div> </body> </html>
效果如下:
css设置文字隐藏使用overflow:hidden;样式,
overflow 属性规定当内容溢出元素框时发生的事情。
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll,不论是否需要,用户代理都会提供一种滚动机制。因此,有可能即使元素框中可以放下所有内容也会出现滚动条。
属性值:
visible 默认值。内容不会被修剪,会呈现在元素框之外。
hidden 内容会被修剪,并且其余内容是不可见的。
scroll 内容会被修剪,但是浏览器会显示滚动条以便查看其余的内容。
auto 如果内容被修剪,则浏览器会显示滚动条以便查看其余的内容。
inherit 规定应该从父元素继承 overflow 属性的值。
推荐:css手册
以上就是css如何隐藏文字?的详细内容,更多请关注0133技术站其它相关文章!