在此答案中,我们共享了如何使用CSS代码为段落中的第一个字符添加首字下沉。在样式表文件中添加以下CSS代码,以对每个段落的第一个字符应用首字下沉。
CSS代码
1
2
3
4
5
6
7
8
9
10
|
.firstcharacter {
color: #903;
float: left;
font-family: Georgia;
font-size: 75px;
line-height: 60px;
padding-top: 4px;
padding-right: 8px;
padding-left: 3px;
}
|
HTML代码
1
2
3
4
5
6
7
8
|
<p>
<span class=“firstcharacter”>L</span> orem 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>
|
如果您不想添加任何CSS类,请在CSS代码下方应用。
1
2
3
4
5
6
7
8
9
10
|
p:first-child:first-letter {
color: #903;
float: left;
font-family: Georgia;
font-size: 75px;
line-height: 60px;
padding-top: 4px;
padding-right: 8px;
padding-left: 3px;
}
|
原创文章,作者:ItWorker,如若转载,请注明出处:https://blog.ytso.com/tech/courses/261802.html