问题描述

我很好奇每个人如何缩小段落的第二行。

我试过了

p{text-indent: 200px;}
p:first-line{text-indent: 0;}

和

p{margin-left: 200px;}
p:first-line{margin-left: 0;}

和

(with position:relative;)
p{left: 200px;}
p:first-line{left: 0;}

有任何想法吗？

谢谢！

最佳解决方案

它是字面上只是你想缩进的第二行，还是从第二行 (即一个悬挂的缩进)？

如果是后者，那么符合这个 JSFiddle 的东西是合适的。

HTML

<div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</div>
<br/><br/>
<span>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</span>

CSS

div {
    padding-left: 1.5em;
    text-indent:-1.5em;
}

span {
    padding-left: 1.5em;
    text-indent:-1.5em;
}

此示例显示如何在 DIV 或 SPAN 中使用相同的 CSS 语法产生不同的效果。

次佳解决方案

这对我有用：

p { margin-left: -2em;
 text-indent: 2em
 }

第三种解决方案

使 left-margin：2em 左右将包括第一行到第二行的整个文本。比以前增加 text-indent(适用于第一行) 为-2em 左右。这使得第一行开始无边距。我尝试了列表标签

<style>
    ul li{
      margin-left: 2em;
      text-indent: -2em;
    }
</style>

参考文献

注：本文内容整合自 Google/Baidu/Bing 辅助翻译的英文资料结果。如果您对结果不满意，可以加入我们改善翻译效果：薇晓朵技术论坛。