如何在HTML中取消文本的首行缩进

Question

我遇到了格式化输出的问题。我希望每行文本都水平靠左。这是我使用的代码。

<div style="text-align: left;">
    <pre style="width: 75%; margin-left:auto; margin-right:auto;"><code class="sql">
        <c:out value="${snippet.query}"/>
    </code></pre>
</div>

尽管样式要求文本左对齐到div，但输出的第一行总是缩进的。为什么会这样？我还不能发布图片，但它看起来像这样：

            CREATE SCHEMA "Trading";
SET SCHEMA '"Trading"';
CREATE STREAM "Orders"
(
   orderTime TIMESTAMP,
   orderId INTEGER,
   productId INTEGER,
   quantity INTEGER,
   unitPrice DECIMAL(11,2),
   shippingState CHAR(2)
);
CREATE STREAM Shipments
(
   shipTime TIMESTAMP,
   orderId INTEGER,
   warehouseState CHAR(2)
);  

我注意到如果我删除“pre”标签，这个问题就不再存在了，但是没有这些标签，文本高亮就无法正常发生。我像这样将变量片段传递给jsp：

  request.setAttribute("snippet", selectedQuery);

在将数据发送到JSP之前，我测试了数据的外观。我在System.out.print()中观察到变量本身没有缩进。selectedQuery是一个包含多个字符串变量的对象。

谢谢你的帮助。

编辑：我尝试在div、pre和code标签中使用text-indent，但这些都没有产生任何效果。

- John

Answer 1

pre标签会包含任何空格。在打开和关闭

标签之间有很多空格。只需删除它们，你就可以了 :)


像这样：

<div style="text-align: left;">
    <pre style="width: 75%; margin-left:auto; margin-right:auto;"><code class="sql">
        <c:out value="${snippet.query}"/>
    </code></pre>
</div>


To

<div style="text-align: left;">
    <pre style="width: 75%; margin-left:auto; margin-right:auto;"><code class="sql">
<c:out value="${snippet.query}"/>
    </code></pre>
</div>

- Jason

---

谢谢！看起来好多了。 - John

为了澄清，这里指的是HTML中的空格，除了字符串变量中可能包含的内容，通常会引起这种混淆。 - rjarmstrong