In-depth understanding of the Box Model (2)

• in the previous section, we talked about the box model. Now we will introduce some elements related to the box model. first, declare the details that are common errors. for specific attributes of an element, see the CSS style sheet by yourself. thank you
  1. border (Border)
  border is generally used to split different elements. Therefore, border needs to be included when the width and height of the calculated elements are high. Therefore, when calculating the precise layout, the Influence of border must be taken into account. In the past, I did not consider border. After I used to coordinate the two
  , I had to limit the total width, when allocating each

  , the Border width is not taken into account, so that the two divs are not tied.
  experience: in hexadecimal format like "#336699", the abbreviation can be "#369"
  2. set different attribute values for different borders
  method:
  if one attribute value is given, it indicates the attribute settings for all borders.
  If two attribute values are given, the former indicates the upper and lower border attributes, and the latter indicates the Left and Right Border attributes

If three attribute values are given, the former indicates the attribute of the upper border, the middle indicates the attribute of the left and right border, and the latter indicates the attribute of the lower border.
If four attribute values are given, they represent the top, right, bottom, and left border attributes in sequence, that is, clockwise sorting.
Note: When multiple rules apply to the same border, a conflict occurs. The subsequent settings overwrite the previous one. When you set the background-color background color for the element, content + padding is used in IE, while content + padding + border is used in Firefox. Remember this!

To be continued ........