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

This article mainly introduces how to adjust the frame of the box in Css. It is very detailed and has a certain reference value. Friends who are interested must read it!

CSS technology uses border series properties to adjust the frame of the box.

1. Adjust the thickness of the box frame:

Border-top-width, set the thickness of the top border of the box.

Border-right-width, set the thickness of the right border of the box.

Border-bottom-width, set the thickness of the bottom border of the box.

Border-left-width, set the thickness of the left border of the box.

Border-width, set the thickness of the four directional borders of the box.

Format for the use of the border-width attribute:

Border-width:top right bottom left

2. Adjust the color of the box border:

Border-top-color, sets the color of the border at the top of the box.

Border-right-color, sets the color of the border on the right side of the box.

Border-bottom-color, sets the color of the border at the bottom of the box.

Border-left-color, sets the color of the left border of the box.

Border-color, sets the color of the four directional borders of the box.

Format for the use of the border-color attribute:

Border-color:top right bottom left

3. Adjust the style of the box frame:

Border-top-style, style the border at the top of the box.

Border-right-style, style the border on the right side of the box.

Border-bottom-style, style the border at the bottom of the box.

Border-left-style, style the left border of the box.

Border-style, style the four directional borders of the box.

Format for the use of the border-style attribute:

Border-style:top right bottom left

The value of the border-style property is as follows:

None, the box has no borders.

Solid, the box frame is solid.

Dashed, the box frame is dotted.

Dotted, the box border is a dot border.

Double, the box frame is a double solid border.

Groove, the box frame is grooved.

Ridge, the box frame is ridged.

Inset, the box frame is sunken.

Outset, the box frame is protruding.

4. Set the border effect of one position of the box:

CSS also provides properties that can set the border effect of a single location of the box.

Border-top, set the effect of the top border of the box.

Border-right, set the effect of the right border of the box.

Border-bottom, set the effect of the border at the bottom of the box.

Border-left, set the effect of the left border of the box.

Use format:

Border-top:style width color

For example: border-top:solid 1px # ff0000

5. Set all the borders of the box to have the same effect:

CSS technology also provides properties that can adjust that all borders of the box have the same appearance.

Border, set the border appearance of the four directions of the box.

Use format:

Border:style width color

For example: border:solid 1px # ff0000

The above is all the contents of the article "how to adjust the frame of a box in Css". Thank you for reading! Hope to share the content to help you, more related knowledge, 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.