Long string becomes omitted css_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 12:24:59
Original
1158 people have browsed it

Very long English, if you want to display two lines in or

, it will be omitted, such as:

Ford acolytes hauled the paper before the Ontario Press Council, charging that the Star's use of unnamed sources was unethical and that the media's focus on the issue was detrimental to the democratic life of the city.

in td becomes
Ford acolytes hauled the paper
before the Ontario Press Council...

How can I do it easily with CSS?


Reply to the discussion (solution)

Try using javascript to cut the string
css There is a similar function in , but it doesn’t seem to work well in td

overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width:150px ;

Your css can only display one line and omit it. I am now using js to insert
to achieve it, but the limitation is very big. When the width of the div changes, it will be troublesome

  <style type="text/css">    td    {      font-size: 12px;      overflow: hidden;      padding-left: 5px;      text-align: left;      text-overflow: ellipsis;      white-space: nowrap;      word-break: break-all;    }    table    {      table-layout: fixed;    }  </style>
Copy after login

Moderator, you are just displaying one line and omitting

Moderator, you are just displaying one line and omitting

You Want to display multiple lines and omit them? The characters will wrap automatically


Automatically wrap Automatically wrap Automatically wrap Automatically wrap Automatically wrap Automatically wrap Automatically wrap Automatically wrap

Generally, ellipses are only displayed on one line. If there are multiple lines, you can refer to this plug-in
http://tpgblog.com/2009/12/21/threedots- the-jquery-ellipsis-plugin/

Thank you moderator, this plug-in is exactly what I want

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template