css控制超出部分自动省略...
一、单行超出自动省略
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css控制超出部分自动省略...</title> <style> .nav { width: 100px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } </style> </head> <body> <div class="nav" title="你你你你你你你你你你你你你你你你你你你你你你你你你你你你你">你你你你你你你你你你你你你你你你你你你你你你你你你你你你你</div> </body> </html>
二、多行超出自动省略(兼容性差)
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css控制超出2行部分自动省略...</title> <style> .nav { width: 100px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } </style> </head> <body> <div class="nav" title="你你你你你你你你你你你你你你你你你你你你你你你你你你你你你">你你你你你你你你你你你你你你你你你你你你你你你你你你你你你</div> </body> </html>