Großbuchstaben ersten Absatz des Absatzes mit CSS

Question

Ich bin auf der Suche nach dem ersten Buchstaben eines Absatzes sehr groß, und den Rest des Textes in diesem Absatz um es zu wickeln. Mit dem unten gezeigten Code macht es so; Das Element p :: first-letter hat jedoch oben und unten eine Art zusätzlichen Abstand. Ich habe versucht, die Padding und Ränder auf 0, aber nichts hat bisher funktioniert.

div.active p::first-letter { 
    display: block; 
    text-shadow: 1px 1px 2px black; 
    color: #A92604; 
    font-size: 500%; 
    float: left; 
} 

div.active p { 
    margin: 0em; 
    display: inline; 
} 

Answer 1

Stellen Sie den line-height und die padding im first-letter Selektor, Wie,

p:first-child:first-letter { 
 
    display: block; 
 
    text-shadow: 1px 1px 2px black; 
 
    color: #A92604; 
 
    float: left; 
 
    font-family: Georgia; 
 
    font-size: 500%; 
 
    line-height: 60px; 
 
    padding-top: 4px; 
 
    padding-right: 8px; 
 
    padding-left: 3px; 
 
}

<p> 
 
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris tristique lobortis orci ac lacinia. Fusce eu purus eget diam vehicula auctor nec eu elit. Morbi consequat facilisis orci vel malesuada. Donec ultrices molestie sollicitudin. Aliquam pharetra 
 
    libero enim. Donec et suscipit massa. Donec dui odio, dignissim non sodales et, tincidunt a sapien. Phasellus elit nibh, adipiscing sed blandit vel, interdum et arcu. 
 
</p>

Answer 2

p::first-letter { 
 
    display: block; 
 
    text-shadow: 1px 1px 2px black; 
 
    color: #A92604; 
 
    font-size: 200%; 
 
}

<p>welcome</p>

Answer 3

Sie müssen Pseudo-Element mit Text-Transformation verwenden: Groß-/Kleinschreibung css-Eigenschaft

• Der :: first-letter Selektor wird verwendet, um einen Stil zum ersten Buchstaben des angegebenen Selektors hinzuzufügen.

• text-transform: kapitalisieren Verwandelt das erste Zeichen jedes Wortes in Großbuchstaben

Beispiel:

p::first-letter { 
    text-transform:capitalize; 
}