CSS first-letter controls - the automatic conversion of the first letter of a paragraph to uppercase

 Sometimes, in order to match the layout of the entire article with the style of the web page, the initials of the English letters at the beginning of the article will be capitalized or beautified with special fonts. This is usually seen in English articles. The built-in first-letter of CSS can let you Easily control the first letter of a paragraph. For example, if you want to use automatic capitalization, here is a simple example. Use the P element to mark a paragraph first


<p>this is a test content.We will use css first-letter set the first letter.</p>


Start using CSS first-letter to style the first letter.
p:first-letter{
 text-transform:uppercase;
}
Present results

This is a test content.We will use css first-letter set the first letter.


In fact, when you open the source code of the web page, you can find that the first letter is still lowercase t. We only use CSS text-transform to convert the first letter locked by first-letter to uppercase and display it directly on the screen. , The essence has not changed. In fact, we can control the beginning of each paragraph of the entire article in one breath through the characteristics of CSS first-letter . Compared with traditional writing, it is easier to style each letter separately, and it can save more For more time, please refer to this article: CSS first-letter .

Post a Comment

0 Comments