Question

我需要在项目的html（带css）中生成以下内容。

我已经使用了多年的HTML，但是如何生成一个页面这些属性使我无法接受。

我一直试图使用绝对和相对的位置，但可以得到在协调工作之后。

任何帮助将不胜感激！

-----------------------  Centered Header Here ------------------------------

1000 Smith Street                                             Date: March 28, 2015
Houston, TX  77043                                       Invoice #:
Phone: 555-555-5000

BILL TO:
Mike Jones
10 Graylord
Houston, TX 77044

 ---------------- Table Starts Here ------

Answer 1

有几种方法可以做到这一点。一些非常简单的例子

旧学校嵌套表

<table>
    <tr>
        <td>Heading</td>
    </tr>
    <tr>
        <td>
            <!--- table for invoice info --->
            <table>
                <tr>
                    <td>
                        <!--- invoice info column 1 --->
                    </td>
                    <td>
                        <!--- invoice info column 2 --->
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td>
            <!--- content table --->
        </td>
    </tr>
</table>

或通过div

<div style="float:left;">
    <h1>heading</h1>
</div>
<div style="float:left; clear:both;">
    <!--- invoice info column 1 --->
</div>
<div style="float:left;">
    <!--- invoice info column 1 --->
</div>
<div style="float:left; clear:both;">
    <!--- table --->
</div>

使用html和css生成特定的对齐方式

1 个答案: