Image of drop cap that is offset

我如何设置下面的padding-left,但是没有在段落中进行设置。我的第一个字符类创建了一个首字下沉,但左侧填充关闭,因此我将左侧填充设置为5px。唯一的问题是,它将文本作为新段落向下推整行。

<span class="firstcharacter">H</span><p style="padding-left:
5px;">eadquartered in Seattle Washingon, yada yada.</p>


屏幕截图已添加。首字下限仍在右侧偏小。这是在Squarespace.com上,我不确定是否还有其他东西搞砸了。我尝试了上面的问题,并且遇到了同样的问题,现在回到这个问题:

p.drop-cap:first-letter {
color: #903;
float: left;
font-family: Futura, 'Trebuchet MS', Arial, sans-serif;
font-size: 75px;
line-height: 60px;
padding-top: 8px;
padding-right: 6px;
padding-left: 0px;


}

最佳答案

尝试将:first-letter样式应用于段落。您可以float第一个字母,使其与段落的其余部分保持一致。



p.drop-cap:first-letter {
font-size: 60px;
float:left;
}

<p class="drop-cap">Headquartered in Seattle Washingon, yada yada. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.</p>

关于html - 左向左填充用于压盖,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/43850153/

10-11 23:25
查看更多