The css syntax of the table border. We know that Dreamweaver has done a great job in Table creation, but sometimes it is necessary to combine css to achieve some specific effects, next we will first sort out the css syntax for the table border, and then introduce how to beautify the table border with css.
Css syntax for table borders
The specific content includes: top Border width, Right Border width, Bottom Border width, Left Border width, Border width, border color, border style, top border, bottom border, left border, right border, border, width, height, related labels, etc.
1. Top Border Width
Syntax: border-top-width: <值>
Allowed value: thin | medium | thick | <长度>
Initial Value: medium
Applicable to: all objects
Backward compatible: No
The top Border Width attribute is used to specify the width of the top border of an element. The value can be one of the three keywords, regardless of the font size or length, and can be used to implement proportional width. Negative values are not allowed. You can also use the upper border, the border width, or the border attribute to slightly write.
2. Right Border Width
Syntax: border-right-width: <值>
Allowed value: thin | medium | thick | <长度>
Initial Value: medium
Applicable to: all objects
Backward compatible: No
The Right Border Width attribute is used to specify the width of the Right Border of an element. The value can be one of the three keywords, regardless of the font size or length, and can be used to implement proportional width. Negative values are not allowed. You can also use the right border, border width, or border attribute to slightly write.
3. Bottom Border Width
Syntax: border-bottom-width: <值>
Allowed value: thin | medium | thick | <长度>
Initial Value: medium
Applicable to: all objects
Backward compatible: No
The Bottom Border Width attribute is used to specify the width of the Bottom Border of an element. The value can be one of the three keywords, regardless of the font size or length, and can be used to implement proportional width. Negative values are not allowed. You can also use the lower border, the border width, or the border attribute to slightly write.
4. Left Border Width
Syntax: border-left-width: <值>
Allowed value: thin | medium | thick | <长度>
Initial Value: medium
Applicable to: all objects
Backward compatible: No
The Left Border Width attribute is used to specify the width of the Left Border of an element. The value can be one of the three keywords, regardless of the font size or length, and can be used to implement proportional width. Negative values are not allowed. You can also use the left border, border width, or border attribute to slightly write.
The Border Width attribute uses one to four values to set the border of an element. The value is a keyword or length. Negative value length is not allowed. If the four values are given, they are applied to the pattern of the top, right, bottom, and left border respectively. If a value is given, it is applied to each edge. If two or three values are given, the omitted value is equal to the logarithm. This attribute is omitted from the top Border width, Right Border width, Bottom Border width, and Left Border width. You can also use the slightly written border attribute.
6. border color
Syntax: border-color: <值>
Allowed values: <颜色> {1, 4}
Initial Value: Color Attribute Value
Applicable to: all objects
Backward compatible: No
The border color attribute sets the border color of an element. You can use one or four keywords. If the four values are given, they are applied to the pattern of the top, right, bottom, and left border respectively. If a value is given, it is applied to each edge. If two or three values are given, the omitted value is equal to the logarithm. You can also use the slightly written border attribute.
The border style attribute is used to set the style of an element border. This attribute must be used to specify the visible border. You can use one or four keywords. If the four values are given, they are applied to the pattern of the top, right, bottom, and left border respectively. If a value is given, it is applied to each edge. If two or three values are given, the omitted value is equal to the logarithm. You can also use the slightly written border attribute.
The upper border attribute is a short write that is used to set the width, style, and color of an element's upper border. Note that only one border style can be provided. You can also use the slightly written border attribute.
9. Right Border
Syntax: border-right: <值>
Allowed values: <右边框宽度> | <边框式样> | <颜色>
Initial Value: Undefined
Applicable to: all objects
Backward compatible: No
The right border attribute is a brief description of the width, style, and color of the Right Border of an element. Note that only one border style can be provided. You can also use the slightly written border attribute.
10. Bottom Border
Syntax: border-bottom: <值>
Allowed values: <下边框宽度> | <边框式样> | <颜色>
Initial Value: Undefined
Applicable to: all objects
Backward compatible: No
The bottom border attribute is a slight write that is used to set the width, style, and color of the Bottom Border of an element. Note that only one border style can be provided. You can also use the slightly written border attribute.
11. Left Border
Syntax: border-left: <值>
Allowed values: <左边框宽度> | <边框式样> | <颜色>
Initial Value: Undefined
Applicable to: all objects
Backward compatible: No
The Left Border attribute is a brief description of the width, style, and color of the Left Border of an element. Note that only one border style can be provided. You can also use the slightly written border attribute.
12. Border
Syntax: border: <值>
Allowed values: <边框宽度> | <边框式样> | <颜色>
Initial Value: Undefined
Applicable to: all objects
Backward compatible: No
The border attribute is a slight write that is used to set the width, style, and color of an element border.
You can set only four border types. You can only specify the width and style of a border group. To give different values of the four borders of an element, the Web Builder must use one or more attributes, such: top border, right border, bottom border, left border, border color, Border width, border style, top Border width, Right Border width, Bottom Border width or Left Border width.
13. Width
Syntax: width: <值>
Allowed values: <长度> | <百分比> | Auto
Initial Value: auto
Applicable to: block-level and replacement Elements
Backward compatible: No
The initial value of the width attribute is "auto", that is, the original width of the element (that is, the width of the element itself ). For the percentage, see the width of the upper-level element. Negative Length values are not allowed.
14. Height
Syntax: height: <值>
Allowed values: <长度> | Auto
Initial Value: auto
Applicable to: block-level and replacement Elements
Backward compatible: No
The initial value of the height attribute is "auto", that is, the original height of the element (that is, the height of the element itself ,). For the percentage, see the width of the upper-level element. Negative Length values are not allowed.
15. Related labels
Table: table label. The definition of the entire table style should be placed in the table;
Td: the cell label. The definition of the cell style should be placed in td.
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.
