我创建了一些 CSS 来处理段落中的第一个字母,看起来也更大,
如何使第一个字母向下并向左推,这样它就不会高于该行本身,并在需要时将其他行缩进到右侧? (见附图)
.text-article {
color: #000;
}
.text-article:first-letter {
font-weight: bold;
font-size: 60px;
font-size: 6rem;
line-height: 10px;
line-height: 1rem;
text-transform: uppercase;
}
<div class="text-article">
We the People is a section of the whitehouse.gov website, launched September 22, 2011,[1] for petitioning the current administration's policy experts. Petitions that meet a certain threshold of signatures are most of the time reviewed by officials in the Administration and official responses are then issued, but not always, as outlined in the Criticism section.[1] Criminal justice proceedings in the United States are not subject to White House website petitions. In fact, no real processes of the federal government are subject to these White House website petitions; they are a public relations device for the present administration which permits citizens to express themselves. On August 23, 2012, the White House Director of Digital Strategy Macon Phillips released the source code for the platform.[2] The source code is available on GitHub, and lists both public domain status as a work of the U.S. federal government and licensing under the GPL v2.[3]
</div>
您可以使用float:left
让第一个字母向下移动并将其他行推开。您还需要调整line-height
为了让它更大一点——我用了40px
/4rem
.
.text-article {
color: #000;
}
.text-article:first-letter {
float:left;
font-weight: bold;
font-size: 60px;
font-size: 6rem;
line-height: 40px;
line-height: 4rem;
height:4rem;
text-transform: uppercase;
}
<div class="text-article">
We the People is a section of the whitehouse.gov website, launched September 22, 2011,[1] for petitioning the current administration's policy experts. Petitions that meet a certain threshold of signatures are most of the time reviewed by officials in the Administration and official responses are then issued, but not always, as outlined in the Criticism section.[1] Criminal justice proceedings in the United States are not subject to White House website petitions. In fact, no real processes of the federal government are subject to these White House website petitions; they are a public relations device for the present administration which permits citizens to express themselves. On August 23, 2012, the White House Director of Digital Strategy Macon Phillips released the source code for the platform.[2] The source code is available on GitHub, and lists both public domain status as a work of the U.S. federal government and licensing under the GPL v2.[3]
</div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)