HTML 文本区域对齐

Question

假设我的文本区域填充了以下文本

employee/company/salary

john/microsoft/12.000

michael/citrusdata/15.000

如何垂直对齐每列以便获得以下文本：

employee__________company__________salary

john______________microsoft__________12.000

michael___________citrusdata__________15.000

在这个例子中，我使用下划线来指定空格，想写一个像 nl2br() 这样的简单函数来用一个或多个制表符替换'/'，但这不是一个一致的解决方案，我想我需要逐行阅读文本并考虑到每个单词的长度，我需要用足够的空格替换 '/' 但不知道如何编码，还有其他方法吗？

Answer 1

您应该指定每列的宽度，例如每列 50 个字符或任何所需的宽度。说吧 $COLUMN_WIDTH = 100; 查找列值（字符串）的长度，而不是从固定长度中减去它，例如 $COUNT_SPACES_TO_INSERT = $COLUMN_WIDTH - strlen($COLUMN_STR); 比插入 $COUNT_SPACES_TO_INSERT 个空格可以解决您的问题。

Answer 2

我想你会在textarea本身之外输出textarea内容，否则你将需要使用js替代。我的答案使用 php :) 因此，您可以使用允许向左或向右填充的 sprintf function。

只需拆分您的内容即可获得行数组

$lines = explode("\n", $content);

注意最后一个条目为空（如果您的内容以 \n 结尾）

然后

foreach($lines as $line) {
    $items = explode("/", $line) ;
    echo sprintf("%-15s%-15s%-15s", $items[0], $items[1], $items[2]) . "<br/>";
}

"%-15" 告诉我们用 15 个空格向左填充。它在控制台上工作，但在网页回显之前你必须 nl2br 它！

这是示例，因此您必须添加错误测试（例如只有一个 / 的行）。

HTML 文本区域对齐

HTML textarea alignment

php

html

css

alignment

word