I am trying to customize every single post of first-paragraph starts with first-letter only, bold and larger fonts. But it does not appear on first-letter of the first paragraph. Instead, it appears on every paragraph rather than the first-paragraph.
This is for a Wordpress template. In the past I've tried using the property first-child
. However, it didn't seem to be working.
p::first-letter {
font-size:300%;
color:#00aff2;
font-style:bold;
border: 2px solid #00aff2;
margin:0 5px 3px 0;
padding: 3px;
}
<p>This is a sample</p>
<p>This is a sample</p>
I would like to customize the first-letter of every first paragraph of a single post in Wordpress.
You can do this easily using the default WordPress block editor. Just click on any paragraph block, then select the font size under 'Typography' on the right-hand side. You can select from the drop-down, which covers Small, Normal, Medium, Large, and Huge.
You can use :first-child
to apply ::first-letter
to the first paragraph only.
p:first-child::first-letter {
font-size:300%;
color:#00aff2;
font-style:bold;
border: 2px solid #00aff2;
margin:0 5px 3px 0;
padding: 3px;
}
<p>This is a sample</p>
<p>This is a sample</p>
Try This
p:first-of-type::first-letter {
font-size:300%;
color:#00aff2;
font-weight: bold;
border: 2px solid #00aff2;
margin:0 5px 3px 0;
padding: 3px;
}
<p>This is a sample</p>
<p>This is a sample</p>
<p>This is a sample</p>
<p>This is a sample</p>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With