This article mainly introduces the CSS in the height and line-height differences, the need for friends can refer to the following line-height: line height set the upper and lower distance between the text
Height: is the height of the definition of a layer or something?
That is, Line-height is a single-line height, and height can be for all elements.
will the edges overlap when the text is enlarged?
Line-height straightforward understanding is the text height plus text up and down the white space, line-height best not set units, if fixed units, row height is to determine the value.
When the font is enlarged and the line-height of the element is not set (inherited from the parent element and the parent element is a fixed value) or its value is a fixed value, the text appears to overlap beyond the line height range.
Line-height has inherited attributes, so the body part content line-height preferably set to the number 1.5, that is, the height of the font height *1.5,
This way, the height of the line is scaled with the font scaling.
How do I set the text picture in line center?
Line-height The default is baseline for it, you can use Vertical-align:middle to align its text picture to the center.
how to read more easily?
In-line text background color #fff, text color #333, the text around the blank line-height line height 1.25-1.5, reduce the pressure, the body size of 14px, the other can be 12px.
Input button each browser behaves consistently.
The default Linde-height value for Firefox defaults to normal and needs to be explicitly specified.
The code is as follows:
button, input[type= "button"], input[type= "Submit"] {
Line-height:normal!important;
}
Input.button, A.button, button {
Font:bold 12px Arial, Helvetica, Sans-serif;
PADDING:5PX 8px;
overflow:visible;
}
