Details about Div + CSS attributes 3

Border attributes

{Box filling property Padding-bottom Padding-left Padding-top Padding-Right Function: border is available for all containers. These attributes set the distance between the border and the elements in the box. Value: Length-set relative or absolute values. Specify the following measurement units after the number: Mm, CM, In, PT, PX, PC, ex, Em. The EM and ex settings generate the font size relative to the parent font. %-Set the border as the percentage of the parent element. Note: The fill value cannot use a negative value, but it can be a decimal number. Box filling properties ---Padding Function: it is a short attribute used to set the spacing between borders and content elements in the upper, lower, left, and right directions. Value: Same as the preceding value. Note: a single value can be used to fill the edges in an equal distance. If two values are used, the first value is used for upper and lower filling, and the second value is used for Left and Right filling. If three values are used, top fill, left fill, and bottom fill. If four values are used, they are respectively used for top, right, bottom, and left fill. You can mix numeric values. Border Properties Border-top Border-bottom Border-Right Border-left Function: these four attributes are short-lived attributes, respectively set the top, bottom, right, left border attributes. By default, no style settings are set for the border. Value: There are three border attributes. Border-width: The value is thin, medium, thick, or the specified length. Border-style: Set the background pattern used to modify the border. You can set the following styles: None, dotted, doshed, solid, double, groove, ridge, inset, and outset. Border-color: Set the border color. Border Properties Border-top-Width Border-bottom-Width Border-Right = width Border-left-Width Function: Set the Border thickness respectively. Value: Thin-thin border. Medium-moderate width. Thick-thick line. Length-set the Border Width in relative or absolute units. Border Properties Border-color Function: This attribute is short for setting the color values of the four borders. Value: You can use a color name or an RGB value. If a single color is specified, the four borders are displayed in this color. If two colors are specified, the order is upper, lower, and left. If three colors are specified, the order is upper, left, and lower; if four colors are specified, the order is top, right, bottom, left. Note: The color name is as follows: Aqua, black, blue, Fuchsia, gray, green, lime, maroon, navy, Olive, purple, Red, silver, teal, white, yellow. Three methods can be used to specify RGB values. # Rrggbb; RGB (R, G, B); RGB (R %, G %, B %) Border Properties Border Function: Short for all border attributes. Value: Border-width-value: thin, medium, thick, or specified length. Border-style-values: None, dotted, dashed, solid, double, groove, ridge, inset, and outset Border-color-available color name or RGB value. Note: unlike other shorthand attributes, each setting can only take one value. This attribute uniformly applies to all sides of the box. Border Properties Border-style Function: displays borders and specified border styles. Value: None-the border is not displayed, which is the default value. Dotted-dot line Dashed-Cable Solid-solid line Double-double line Groove-3D cabling Ridge-3D ridge Cable Inset-make the page sink Outset-make the page feel surfaced Note: not all browsers can display Ridge, inset, and outset styles. Some browsers draw all borders into solid lines. Box boundary attributes Margin-bottom Margin-left Margin-Right Margin-top Function: these four attributes are used to set the distance between an element and its adjacent elements. They can be defined by length or the percentage of width relative to the parent text, or automatically processed. Value: Length-set the relative or absolute distance between the corresponding edge of the element and the edge of the box. Valid units: Mm, CM, In, PX, PT, pica, ex, em... %-Set the boundary size as the percentage of the parent element width. Auto-auto. This setting takes the default border of the browser. Box boundary attributes Margin Function: Short for setting all boundaries of an element. This is used to describe the distance from the edge of the element content to the edge of the box. This area is always transparent and you can see the background of the following page. Value: Length-same as before %-Set the boundary size as the percentage of the parent element width. Auto-auto. This setting takes the default border of the browser. Box location attribute Height Function: sets the element height. The browser adjusts the Image Based on the height. Value: Length-mm, CM, PX, PT ,..... Auto-auto. Box location attribute Width Function: sets the element width. The browser adjusts the Image Based on the width. Value: Length:-Mm, CM, In, PX, PT ,...... Percent-set the graph size to the percentage of the width of the parent element. Auto-Automatic Adjustment Box location attribute