How to set indentation and spacing in the first line of a WordPress article section

Source: Internet
Author: User
Kids shoes who like to play with wordpress know that wordpress's built-in themes generally do not set the character indent for the first line of the article section (because wordpress is developed by foreign users)

All the children's shoes who like to play with wordpress know that wordpress's built-in themes generally do not enable the character indent settings for the first line of the article section (because wordpress is developed by foreign users, when writing articles abroad, the first line of a paragraph is generally not indented), and the spacing between the paragraph and the paragraph is not very suitable, it looks very influential. what should I do at this time? In fact, if you understand CSS, you only need a little time to solve it. Let's talk about how I modified it!

Indent the first line of a paragraph

Log on to your website, go to the wordpress background, click appearance> Edit, find the CSS style file of the current application topic, open and locate the defined CSS style of the article content, generally, it is # content or. content, no matter which one can, and then add a CSS style file below it, that is, the CSS style to be used and paragraph indent. I added the following for your reference only.

. Content-c p {text-indent: 2em ;}

Simple description :. content-c indicates that the CSS is a class selector, and p indicates its role and paragraph. text-indent is a setting attribute in CSS, this attribute can be used to indent text characters, including length (length) and precentage (percentage). length (length) and pecentage (percentage) can be negative values, the default value is 0. Obviously, I used the length value method to indent the first line of a paragraph by two characters.

Section spacing settings

The basic operations are the same as the settings above. open the theme CSS style sheet in the background and locate the defined CSS style file that acts on the section in the # content or. content, no matter which one can, and then add a CSS style file below it. I added the following for your reference only.

. Content-c p {margin-bottom: 10px}

Simple description :. content-c indicates that the CSS is a class selector, and p indicates its role and paragraph. margin is an attribute in CSS that sets the object margin, it has four forms: margin-top, margin-left, margin-bottom, and margin-right, margin on the left, margin on the bottom, and margin on the right. this property has auto (automatic) length (length) and precentage (percentage). Obviously, I used the length value method to set the bottom margin of a paragraph to 10 pixels.

If you are familiar with CSS, you can see that these two CSS styles can be merged into one, as shown below:

. Content-c p {text-indent: 2em; margin-bottom: 10px}

The effect of merging and not merging is exactly the same. However, considering the space saving and website loading speed, we suggest you merge them together, and all CSS files can be merged together as much as possible.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.