Table border processing is often encountered in the CSS page layout, in the webjx.com also has a related introduction, in addition to the table as a whole to define, you can also define the four parts of the table border, including the top, bottom, left and right. The code in List B divides the table in the example that you just described into four separate sections.
you may notice that the border of the entire caption element is defined as a Blue 5-point ridge effect, while the top of the caption border is set to 10 points. If a separate border setting (left, right, top, bottom) appears later, it will overwrite the original overall border setting.
In addition, in the previous example, by assigning the border properties of a TABLE element, you can implement multiple borders (anchor tags, table bodies, table headers, individual cells, and so on) in a table.
Border Spacing
you can specify the distance between adjacent cells by using the Border Spacing property. You can specify one or two values, and if a value is specified, both horizontal and vertical spacing will use this value, and if two values are specified, the first value specifies the horizontal spacing and the second values specify the vertical spacing. These values cannot be negative, and I used the 10-point spacing value in this example.
table Behavior
The collapse property of the
border sets the table's border model, the default value of which is a separate border model, and the separate border model uses the Border-spacing property as the spacing between the different borders, which uses a TABLE element as the fill background.
for the border model, the World Wide Web Consortium (Wide) defines the following rules for resolving table-style conflicts:
Using the border of the ' Hide ' border property takes precedence over the other border properties, and any border using the ' hidden ' property is higher priority than the other border properties. (www.3lian.com)
uses a ' no style ' border with the lowest precedence, and if the border property of all elements in the same position is ' no style ', the table border is ignored. (Note that ' no style ' is the default value for the border style.) ）
If there is no style set to ' hide ' and at least one style is not set to ' no style ', then the wide border has precedence over the thin border. The precedence of the border style is as follows: Double solid line, solid line, dashed line, Dot, Ridge line, outer convex, groove line, lowest level is concave.
If the border style has only a different color, the cell's style precedence is higher than the row's precedence, and is higher than the row group, column, column group, and entire table.
Border
The
table, like other HTML elements, has many CSS style options. A good example of the borders of tables and cells is that CSS should be able to meet your needs for table styles. However, tables formatted with CSS display different effects in different browsers, so extensive testing is required.
The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion;
products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the
content of the page makes you feel confusing, please write us an email, we will handle the problem
within 5 days after receiving your email.
If you find any instances of plagiarism from the community, please send an email to:
info-contact@alibabacloud.com
and provide relevant evidence. A staff member will contact you within 5 working days.
