Question

我们正在尝试制作带有滚动图像背景的HTML简报（类似http://images.clipartpanda.com/blank-scroll-clip-art-ancient-parchment-scroll-Download-Royalty-free-Vector-File-EPS-2942.jpg），并且希望能够将文本放在其特定区域。理想情况下，我们希望能够轻松地将文本放置在顶部区域（卷起的部分），中间或底部（再次，在卷起的部分中）。

最好的方法是什么？我们正在尝试使用图像作为表格的背景，并使用表格单元格尝试与图像区域对齐，但努力使其工作。

我们是否应该尝试将图像分成三个单独的图像（顶部，中间，底部），并将这些图像用作三行表格的背景，或者可能无法正常工作？

为我们的无知道歉。我们的HTML技能并不是真的存在;我们只想要一个简单的布局，我们可以用它来制作新闻简报。

编辑：这是我们目前正在尝试的内容：

<html>
    <head>
    </head>
    <body>
        <table style="height: 600px; width: 600px; background-image: url(http://cliparts.co/cliparts/qiB/orL/qiBorL8gT.jpg); background-repeat: no-repeat; background-size: 100% 100%; background-origin: content-box">
            <tbody>
                <tr>
                    <td class="">&nbsp;
                    <table style="height: 500px; width: 400px; margin: auto;">
                        <tbody>
                            <tr style="height: 100px;">
                                <td>This is some text in the top area</td>
                            </tr>
                            <tr style="height: 400px;">
                                <td>This is the main text</td>
                            </tr>
                            <tr style="height: 100px;">
                                <td>This is some text in the bottom area</td>
                            </tr>
                        </tbody>
                    </table>
                    <br>
                    </td>
                </tr>
            </tbody>
        </table>
        <br>
    </body>
</html>

我很欣赏这些日子可能是错误的方法;什么是更好的方法？这真的过时了吗？

HTML简报 - 在图像的各个部分叠加文本，可能使用表格

0 个答案: