Revision history [back]

Box models in HTML can be modified by changing the values of CSS properties that control the content, padding, border, and margin of the box.

1. Content: To modify the content area of a box model, use the CSS property "width" and "height" to set the dimension of the box. For example:

.box {
  width: 300px;
  height: 200px;
}

1. Padding: To modify the padding area around the content, use the CSS property "padding". For example:

.box {
  padding: 20px;
}

1. Border: To modify the border around the box, use the CSS property "border" with values for "width", "style", and "color". For example:

.box {
  border: 2px solid black;
}

1. Margin: To modify the space around the box outside of the border, use the CSS property "margin". For example:

.box {
  margin: 20px;
}

By adjusting these properties, you can modify the appearance and layout of box models in HTML to suit your design needs.