我正在尝试实施正文第一段第一个字母的内容。我被困在哪里是在第一个字母和段落的其余部分之间获得一致的间距。

例如,“W”与“W”之间的间距存在巨大差异。和“我”


任何人都对如何减轻差异有任何想法?我更喜欢纯CSS解决方案,但如果需要,我会使用JavaScript。

PS :我不一定需要IE或Opera中的兼容性

有帮助吗?

解决方案

将此应用于 p.outdent:first-letter

margin-left: -800px;
padding-right: 460px;
float: right;

这会将第一个字母放在段落的右边缘上,然后将它或多或少地拉到段落的宽度,然后将字母和所有填充都移动到浮动的大的负边距中,这样段落适合边缘,不会试图缠绕。

其他提示

我尝试使用像'courier new'这样的固定宽度字体,因为这些字符的宽度大致相同,所以它不太明显。

编辑 - 这个字体很不错,但可能仅适用于Windows

p.outdent:first-letter {
    font-family: ms mincho;
    font-size: 8em;
    line-height: 1;
    font-weight: normal;
    float: left;
    margin: -0.1em 0 0 -.55em;
    letter-spacing: 0.05em;
}
许可以下: CC-BY-SA归因
不隶属于 StackOverflow
scroll top