General text truncation (applies to inline and block):
.text-overflow {
display: block;/*Inline objects need to be added*/
width:25em;
word-break:keep-all;/* No line breaks*/
white-space :nowrap;/* No line breaks*/
overflow:hidden;/* Hide the excess content when the content exceeds the width*/
text-overflow:ellipsis;/* When the text within the object Display omission mark (...) when overflowing; needs to be used together with overflow:hidden;. */
}
For table text overflow definition:
For table out of range display ellipsis
table{
width:25em;
table-layout:fixed;/* Only when the layout algorithm of the table is defined as fixed, the definition of td below will work. */
}
td{
width:100%;
word-break:keep-all;/* No line breaks*/
white-space:nowrap;/* No line breaks*/
overflow:hidden;/* Hide the excess content when the content exceeds the width*/
text-overflow:ellipsis ;/* Display the omission mark (...) when the text in the object overflows; needs to be used together with overflow:hidden;. */
}
Such as:
------------ -------------------------------------------------- ----------------------------------
If you want to mouse over To stop displaying the content of the ellipsis, just write it in the title~
Code:
<style type="text/css">#div1{ padding: 10px; width: 200px; height:30px; text-shadow: 3px 3px 3px #aaaaaa; border: 1px solid #999999; text-overflow: ellipsis; overflow: hidden; word-break: break-all; white-space: nowrap; }</style><body><div id="div1" title="AAAAAAAAAAAAABBBBBBBBBBBBBCCCCCCCCCCCCCCDDDDDDDDDDDD"> AAAAAAAAAAAAABBBBBBBBBBBBBCCCCCCCCCCCCCCDDDDDDDDDDDD</div></body>
bootmgr is missing and cannot boot
How to update graphics card driver
border-radius
Solution to the problem that exe files cannot be opened in win10 system
How to fix winntbbu.dll missing
Implement 301 jump method through js code
What does wifi deactivated mean?
How to import mdf files into database
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
