Shulou(Shulou.com)06/01 Report--

This article editor for you a detailed introduction of "CSS table properties how to set", the content is detailed, the steps are clear, the details are handled properly, I hope this "CSS table properties how to set" article can help you solve doubts, the following follow the editor's ideas slowly in-depth, together to learn new knowledge.

Table property settings with good results:

The code is as follows:

Many people have this experience: when there is no content or visible elements in a td, the border of td will also disappear. The solution is to add style border-collapse:collapse to table

General text truncation (for inline and block):

The code is as follows:

. text-overflow {

Display:block;/* inline objects need to be added * /

Width:31em

Word-break:keep-all;/* does not wrap * /

White-space:nowrap;/* does not wrap * /

Hide the content beyond the width when overflow:hidden;/* content exceeds the width * /

Text-overflow:ellipsis;/* displays an ellipsis mark (...) when text overflows within an object; it needs to be used with overflow:hidden;. , /

}

For tables, the definition is a little different:

The code is as follows:

Table {

Width:30em

The following definition of td will work only if table-layout:fixed;/* defines the layout algorithm of the table as fixed. , /

}

Td {

Width:100%

Word-break:keep-all;/* does not wrap * /

White-space:nowrap;/* does not wrap * /

Hide the content beyond the width when overflow:hidden;/* content exceeds the width * /

Text-overflow:ellipsis;/* displays an ellipsis mark (...) when text overflows within an object; it needs to be used with overflow:hidden;. , /

}

Javascript operation table,tr,td

The code is as follows:

The rows between the rows (IE) m and n of the exchange table table.moveRow (m) / / move in turn

Table.deleteRow (index) / / Line deletion

Table.insertRow (index) / / inserts a row at the index location and returns the TR

Tr.insertCell (index) / / insert the cell and return the TD

Tr.deleteCell (index)

Tr.rowIndex// returns the position of tr in the table

Td.cellIndex / / returns the location of td in tr

Read this, the "CSS table properties how to set" article has been introduced, want to master the knowledge of this article also need to practice and use to understand, if you want to know more about the article, welcome to follow the industry information channel.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.