首页 > 解决方案 > 缩进任何不以大项目符号字符开头的环绕文本行?

问题描述

我有一系列文本行,每行都以大项目符号和空格开头,并由 br 标签分隔。

正在使用 br 标签,因为 Blogger 用这些标签替换了 p 标签。

我想缩进任何不以大项目符号字符开头的换行文本,以模拟项目符号列表。换行的文本应与红线对齐。

Blogger 的主页帖子片段去除了列表标签。

在此处输入图像描述

在此处输入图像描述

● Some Text. More Text. Even More Text. Additional Text. <br>
● Some Text. More Text. Even More Text. Additional Text. <br>
● Some Text. More Text. Even More Text. Additional Text. <br>
● Some Text. More Text. Even More Text. Additional Text. <br>

用于 Blogger 帐户的主页显示每个帖子的小文本片段 + 帖子标题和帖子中使用的第一张缩略图。

片段小部件只识别一些样式标签,a 标签和 br 标签。列表标签被剥离。Blogger 将 p 标签替换为 br 标签。

我使用列表在帖子中显示我的内容,并希望在片段中模拟列表。这是两个垂直堆叠的列表在主页片段中的显示方式。这糟透了!

在此处输入图像描述

我在每个 li 的开头添加了一个 span / section,里面有一个大子弹。这通过头部内的代码隐藏在实际的帖子页面上。这个跨度/部分的内容,即大项目符号,显示在主页的片段中,尽管实际的跨度/部分标签将被片段剥离。在每个 li 标签的末尾添加一个 br 标签以强制在片段中换行 - 这个 br 标签不会改变实际帖子的外观。

这模拟了在实际帖子中找到的列表,但我无法模拟任何包装文本的缩进。

<b>List Title 1</b>
<ul><div class="outer">

<li><section class="pointer">● </section><i>This is some sample text in the first li tag of the list, with more text to follow..<br>
</li>
</div>
<div class="outer">

<li><section class="pointer">● </section>This is some sample text in the second li tag of the list, with more text to follow. Some more text here as promised.</i>.<br>
</li>
</div>
<div class="outer">

<li><section class="pointer">● </section>This is some sample text in the third li tag of the list, with more text to follow. Some more text here as promised. More text here also and her also.<br>
</li>
</div>
<div class="outer">

<li><section class="pointer">● </section>A similar <i>Seiler</i> This is some sample text in the fourth li tag of the list, with more text to follow. Some more text here as promised. More text here also and her also.<br>
</li>
</div>
<div class="outer">

<li><section class="pointer">● </section>This is some sample text in the fifth li tag of the list, with more text to follow. Some more text here as promised. More text here also and her also. Cemetery.<br>
</li>
</div>
</ul>

在此处输入图像描述

我在现有的 Blogger 模板中添加了 427 多行自定义代码。

在此处输入图像描述

标签: htmlcsspaddingindentationblogger

解决方案


推荐阅读