Adjustment of spacing distance between P tag paragraph and CSS paragraph in html

In general, we use htmle388a4556c0f65e1904146cc1a846bee tags to segment article paragraphs on web pages. I collected and organized this article just because a certain website has different effects in different browsers due to the use of the p tag. In order to maintain the same effect as much as possible, I have briefly organized the article. Using the P tag of html will create a distance between the previous article and the next article. How to control the spacing between P and P?

1. line-heightLine height

The larger we set the value of line-height, the spacing between paragraphs will increase, and the spacing between words will also increase. Increase, this line-height style setting is not recommended.

css code:

p{line-height:22px}

2. css paddingInner padding (Inner margin)

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

css code:

p{padding:10px 0}

3. css marginOuter margin

CSS paragraph spacing adjustment margin realizes the upper and lower paragraphs Spacing distance style setting, we know that margin is to set the distance between the top, bottom, left and right object and the object. Here the paragraph can also use this css style to achieve spacing.

css code:

p{margin:10px 0}

4. Summary of paragraph spacing

Website articles are divided into paragraphs. Generally, html p tags are used, and for paragraph spacing settings, we recommend using padding and margin. Implementation, so that the spacing distance can be easily adjusted and the distance between paragraphs can be beautified.

The above is the detailed content of Adjustment of spacing distance between P tag paragraph and CSS paragraph in html. For more information, please follow other related articles on the PHP Chinese website!