CSS min-height property

 The function of the CSS min-height property is to set the minimum height limit of webpage elements, such as the minimum height of an image , the minimum height of a DIV block , or the minimum height of a paragraph, all of which can be set with the CSS min-height property. At the time, the size of the elements in the webpage will change with the conditions of the webpage itself, and the height will also change accordingly. We can use the CSS min-height property to limit the minimum height of an element, which is currently supported by all mainstream browsers. The effect of the CSS min-height property.

CSS min-height property syntax

min-height: height value;

The CSS min-height property can customize the minimum height of web page elements (using common units such as px, em, cm... etc.) or use a percentage to determine the minimum height. Negative values ​​cannot be set. In addition, although the CSS min-height property has an inherit property value, Internet Explorer does not support the inherit property value of the CSS min-height property, so it is not recommended.

CSS min-height property example: set the minimum height of an image

This is the original picture<br><img src="upload/20141007145509.png" style="height:auto;"><br><br>
This is the picture with the min-height attribute<br><img src=" upload/20141007145509.png" style="min-height:100px;">

Example output effect

This is the original picture


This is the picture with the min-height property set

The example has two pictures in total. The first picture is set to "height:auto;" to allow the browser to determine the size of the original picture, the height is 80px, and the second picture uses the CSS min-height property to set the minimum height to 100px. The picture is enlarged in proportion, because we force the height of the picture to be at least 100px, which is higher than the original height, so the picture will automatically become bigger! This is the basic usage of the CSS min-height property. In addition to using a fixed height, percentages are also quite common.

Corresponding to the CSS min-height property, it is used to set the maximum height: CSS max-height property .