CSS - Line Spacing

问题:

How can I set line spacing with CSS, like we can set line spacing in MS Word?

回答1:

Try the line-height property.

For example, 12px font-size and 4px distant from the bottom and upper lines:

line-height: 20px; /* 4px +12px + 4px */ 

Or with em units

line-height: 1.7em; /* 1em = 12px in this case. 20/12 == 1.666666  */ 

回答2:

Late to this party, but wanted to add on.

You can also use a unit-less value, which is the number of lines: line-height: 2; is double spaced, line-height: 1.5; is one and a half, etc.

回答3:

Try this property

line-height:200%; 

or

line-height:17px; 

use the increase & decrease the volume

回答4:

If you want condensed lines, you can set same value for font-size and line-height

In your CSS file

.condensedlines {                   font-size:   10pt;     line-height: 10pt;  /* try also a bit smaller line-height */ } 

In your HTML file

 bla bla bla bla bla bla 
 bla bla bla bla bla bla 
 bla bla bla bla bla bla 
 

--> Play with this snippet on jsfiddle.net

You can also increase line-height for fine line spacing control:

.mylinespacing {     font-size:   10pt;     line-height: 14pt; /* 14 = 10 + 2 above + 2 below */ } 

回答5:

You cannot set inter-paragraph spacing in CSS using line-height, the spacing between

blocks. That instead sets the intra-paragraph line spacing, the space between lines within a

block. That is, line-height is the typographer's inter-line leading within the paragraph is controlled by line-height.

I presently do not know of any method in CSS to produce (for example) a 0.15em inter-

spacing, whether using em or rem variants on any font property. I suspect it can be done with more complex floats or offsets. A pity this is necessary in CSS.

回答6:

I am not sure if this is what you meant:

line-height: size; 

回答7:

Try line-height property; there are many ways to assign line height

文章来源: CSS - Line Spacing