問題描述

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

我試過了

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 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。