How to set css paragraph spacing

Setting method: 1. Use the line-height attribute setting, the syntax "line-height: height value"; 2. Use padding to set the upper and lower spacing of the paragraph, the syntax "padding: spacing value 0"; 3. Use margin Set the spacing between the upper and lower paragraphs with the syntax "margin: spacing value 0".

The operating environment of this tutorial: Windows 7 system, CSS3&&HTML5 version, Dell G3 computer.

There are three common ways to set the distance between upper and lower paragraphs through CSS, as follows:

1. Line-height

We set the value of line-height more If larger, the paragraph spacing will increase, and the spacing between words will also increase. It is not recommended to use this line-height style to set the paragraph spacing distance. In order to observe the effect, we set the CSS line-height to 20px and 50px respectively to compare the effect.

Key CSS code: p{line-height:22px}

      
  
第一段，第一行
 第二行
 
第二段
 
第三段
  

2. CSS padding inner padding (inner margin)

It is recommended to use padding to set the upper and lower spacing of the paragraph. By setting the upper and lower inner padding and inner distance, you can set the upper and lower spacing of p paragraphs.

      
  
第一段，第一行
 第二行
 
第二段
 
第三段
  

3. css margin margin

CSS paragraph spacing adjustment margin implements the spacing distance style setting between the upper and lower paragraphs. We know that margin is to set the distance between the upper, lower, left, and right objects, and the object. This paragraph can also use this css style to achieve spacing.

      
  
第一段，第一行
 第二行
 
第二段
 
第三段
  

Recommended learning:css video tutorial

The above is the detailed content of How to set css paragraph spacing. For more information, please follow other related articles on the PHP Chinese website!