CSS DIV border attribute_html/css_WEB-ITnose

It is most commonly used to insert a border into a div layer. It is like a table and can wrap styles, text, and pictures. The border border attributes mainly learn the border style attribute (border-style), the border width attribute (border-width), and the border color attribute (border-color). These three attributes can be diversified for the entire border or a single frame. Through the method of anatomical learning, each attribute is decomposed, so that the basic attributes can be better learned and simple applications can be learned.

1. Border-style attribute,
is used to set the style of the upper, lower, left and right borders. The specific parameter values ​​are:

none (no border), dotted (dotted) Line border), dashed (dashed line border), solid (straight line border), double (double line border), groove (groove line border), ridge (ridge line border), inset (inline effect border), outset (border with protruding effect), the following takes the most commonly used linear border as an example, the code reference writing is as follows:

Follow the example of CSS DIV(09): Strengthen the border attribute

< ;/html>

2. Border-width attribute (border-width), used to set the width of the upper, lower, left and right borders. The specific parameter values ​​are:

medium (is the default value), Thin (thinner than medium), thick (thicker than medium), are determined in length units; absolute length units (cm, mm, in, pt, pc) or relative length units (em, ex, px) can be used. I prefer to use px units. Taking the linear 1-pixel border as an example, the code reference writing is as follows:

< style type=”text/css”>
.apple {border-style:solid; border-width:1px;}


< body>

Follow the example of CSS DIV(09): Strengthen the border attribute

3. The border color attribute (border-color) is used to set the color of the upper, lower, left and right borders. The color value can refer to the color palette. For example, a linear 1-pixel red border is used as an example. The code reference is as follows ：

< div class = "apple"> Follow the example of CSS DIV(09): Strengthen the border attribute