如何正确对齐html/css中的首字下沉？

Question

好吧,我有以下问题:我需要一个动态解决方案(不知道文本,产生字体大小等),以典型地正确对齐一个下降帽.正确的意思是:下降帽的帽高度线应与段落的帽高度线相同.

例如:ZŽẐ应该都与它们的上部水平条对齐.虽然我已经看到了这个问题的一些(错误的)解决方案(它们对齐整体高度因此看起来很糟糕,有重音,dieresis等),我没有看到任何正确的解决方案.

有人知道吗？

PS:它可以工作,如果我找到一些方法来一致地将dropcap的基线与段落的第二行的基线对齐,因为从那里可以使用font-size的%-modifier完成.不幸的是,我也不知道如何归档这个.

这是一个可以玩的东西:

p.cap {
    text-indent: 0;
    font-size: 125%;
    line-height: 125%;
    text-align: justify;
}

p.cap:first-letter {
    display: inline-block;
    float: left;
    font-size: 230%;
}

http://jsfiddle.net/s856R/

Answer 1

查看您更新的小提琴：

jsFiddle

尝试这个 ：

p.cap {
     text-indent:0; font-size:125%; line-height:125%;
     text-align:justify;
 }

p.cap:first-letter {
     display:inline-block; float:left; font-size:280%;margin-top:15px
}