css - 当文本在 HTML 段落中换行时，使用 *only* css 与第一行上的第一个非空白字符对齐

Question

我有一段文字如下：

<p>

&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp;&ensp; In this respect, the conceptual structure of the Act is something like a pyramid. The pyramid shape illustrates the way the income tax law is organised, moving down from the central or core provisions at the top of the pyramid, to general rules of wide application and then to the more specialised topics.

</p>

目前它呈现为：

                   在这方面，该法案的概念结构有点像金字塔。金字塔形状说明了所得税法的组织方式，从金字塔顶部的中央或核心条款向下移动到广泛适用的一般规则，然后到更专业的主题。

我希望它像这样呈现：

                   在这方面，该法案的概念结构类似于
                   金字塔。金字塔形状说明了所得税法的方式  
                   有组织的，从顶部的中央或核心条款向下移动
                   金字塔，到广泛应用的一般规则，然后到更多
                   专门的话题。

只使用 CSS！

背景故事

我正在将 Markdown 文件转换为 HTML。这些文件在源代码管理中。Markdown 文件已经使用 字符为我缩进了。我还想要干净的提交日志，所以我想将每个日志保留<p>在一行上。

编辑

以下是 Markdown 文档之一的部分要点：https ://gist.github.com/vjpr/5378401

基本上我想

• 避免在我的 Markdown 文档中使用内联 html。
• 允许在 GitHub 上使用缩进查看 Markdown 文档。
• 允许使用自定义样式表查看相同的 Markdown 文档，并保持将段落包装在与第一个非空白字符相同的缩进级别，如图所示。

Answer 1

您可以使用 padding-left 和负文本缩进的组合，例如

p{
    padding-left:18em;
    border: 1px solid black;
    text-indent :-9em;
}

小提琴示例：http: //jsfiddle.net/NzUtM/1

根据需要随意调整填充和缩进。