Graphic CSS (2): border-border

Source: Internet
Author: User
A style sheet can be external, inline, embedded, or linked. For example, the following inline style applies to all labels with ID = test:
<style> #Test {...} </style>
borderborder-widthborder-styleborder-colorborder-topborder-top-widthborder-top-styleborder-top-colorborder-bottomborder-bottom-widthborder-bottom-styleborder-bottom-colorborder-leftborder-left-widthborder-left-styleborder-left-colorborder-rightborder-right-widthborder-right-styleborder-right-colorborder-collapseborder-spacing
 

Border: width style color;


Border width has three common values: medium (default), thick (rough), and thin (fine ).




The biggest trouble with custom width is the unit of width (in, CM, mm, em, ex, PT, PC, PX). I like to use pixels (PX ).


Border style: none (default), solid, double, dotted, dashed, groove, ridge, inset, and outset.










In the last four 3D styles, it will be better if you use the default 3D Color:





There are five ways to specify the color (such as blue): RGB (255, 100%); # 0000ff; # 00f; blue; RGB ).






Border: The color of the width style. It can be omitted from the back to the front or separated by border-width, border-style, and border-color.


You can use border-top, border-bottom, border-left, and border-right to describe the four edges;
You can use border-top-width, border-top-style, and border-top-color to describe the width, style, and color of each side.


The border-related styles listed above include border-collapse and border-spacing. This is table-related.

Border-collapse has two common values: collapse and separate, which determine whether the border is separated:



Border-Spacing: used to set the spacing of cells in the table. It seems that IE (8) is not supported, but this is the same as the cellspacing attribute of the table.

Related Article

Contact Us

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.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.