How to use CSS to create the drop cap effect
Editor to share with you how to use CSS to create the drop effect of the first word, I believe that most people do not know much about it, so share this article for your reference, I hope you can learn a lot after reading this article, let's go to know it!
Answer: use CSS::first-letter pseudo elements
You can use CSS::first-letter pseudo elements to create beautiful drop caps for articles. The drop cap is just the first capital letter of a paragraph, and its font is much larger, with the depth of two or more lines of ordinary text. Let's look at an example:
Try this code for example »
Drop Caps with CSS
P::first-letter {
Float: left
Font-size: 5em
Font-weight: bold
Line-height: 1
Text-shadow: 2px 2px 6px # 000
Margin:-0.07em 0.1em-0.1em 0
}
Tempor ipsum dolor sit amet...
The above is all the content of the article "how to use CSS to create the drop caps effect". Thank you for reading! I believe we all have a certain understanding, hope to share the content to help you, if you want to learn more knowledge, welcome to follow the industry information channel!
