The actual column is as follows:
. Title
{
Width: 200px;
White-space: nowrap;
Word-break: keep-all;
Overflow: hidden;
Text-overflow: ellips tutorial is;
}
Span or div references are available, for example:
<Span class = title> The title displayed on the client is too long. The unused part is omitted and the ellipsis is added. </span>
<Div class = title> the client solves the problem. The title is displayed too long. The unused part is omitted and the ellipsis is added. </div>
The above two examples show that after the PX width of the style definition is exceeded, the subsequent characters will be replaced.
The above is incompatible with ie7 ff. I will make some adjustments below.
<Style type = "text/css tutorial">
<! --
. Div1 {
Width: 200px;
}
. Div1 span {
White-space: nowrap;
Text-overflow: ellipsis;/* for internet explorer */
Overflow: hidden;
Width: 168px;
Display: block;
Float: left;
}
Html> body. div1: after {/* for FF */
Content :"...";
Margin-left: 5px;
}
-->
</Style>
<Div class = "div1"> <span> the compatibility of the Internet Explorer 7 recently released by Microsoft does impose a heavy burden on some page makers </span> </div>