Question

我切了一个PSD，然后Photoshop将代码全部放在表格中。我使用它就像我不太了解编码。该网站看起来不错，但我遇到了问题，我必须滚动到两侧（左和右）因为我使网站宽1681像素，这比我的显示器大。有什么方法可以使用html或css“缩小”所有东西，所以我不需要重新设计，所以它适合浏览器或监视器的“宽度”？

或多或少..我得到的只是一张桌子，里面有一些东西。

<HTML>
<HEAD>
</HEAD>
 <table id="Table_01" width="1681" height="1050" border="0" cellpadding="0"   cellspacing="0">
 <tr>
    <td colspan="8">
        <img src="01" width="1358" height="59" alt=""></td>
    <td rowspan="2">
        <img src="02" width="322" height="118" alt=""></td>
    <td>
        <img src="sar.gif" width="1" height="59" alt=""></td>
</tr>
<tr>
    <td colspan="2" rowspan="2">
        <img src="03.png" width="531" height="178" alt=""></td>
    <td rowspan="3">
        <img src="home.jpg" width="178" height="236" alt=""></td>
    <td rowspan="3">
        <img src="alke.png" width="118" height="236" alt=""></td>
    <td rowspan="3">
        <img src="ing.png" width="118" height="236" alt=""></td>
    <td rowspan="3">
        <img src="images.png" width="118" height="236" alt=""></td>
    <td rowspan="3">
        <img src="es.png" width="118" height="236" alt=""></td>
    <td rowspan="3">
        <img src="s.png" width="177" height="236" alt=""></td>
    <td>
        <img src="images/scer.gif" width="1" height="59" alt=""></td>
</tr>
<tr>
    <td rowspan="2">
        <img src="10.png" width="322" height="177" alt=""></td>
    <td>
        <img src="er.gif" width="1" height="119" alt=""></td>
</tr>
<tr>
    <td rowspan="2">
        <img src="11.png" width="295" height="235" alt=""></td>
    <td>
        <img src="12.png" width="236" height="58" alt=""></td>
    <td>
        <img src="pacer.gif" width="1" height="58" alt=""></td>
</tr>
<tr>
    <td colspan="6" rowspan="2">
        <img src="13.png" width="886" height="650" alt=""></td>
    <td colspan="2" rowspan="2">
        <img src="14.png" width="499" height="650" alt=""></td>
    <td>
        <img src="spacer.gif" width="1" height="177" alt=""></td>
</tr>
<tr>
    <td>
        <img src="15.png" width="295" height="473" alt=""></td>
    <td>
        <img src="spcer.gif" width="1" height="473" alt=""></td>
</tr>
<tr>
    <td colspan="9">
        <img src="16.png" width="1680" height="53" alt=""></td>
    <td>
        <img src="spaer.gif" width="1" height="53" alt=""></td>
</tr>
<tr>
    <td colspan="9">
        <img src="17.png" width="1680" height="46" alt=""></td>
    <td>
        <img src="spacer.gif" width="1" height="46" alt=""></td>
</tr>
<tr>
    <td colspan="9">
        <img src="18.png" width="1680" height="6" alt=""></td>
    <td>
        <img src="spacr.gif" width="1" height="6" alt=""></td>
</tr>
 </table>
 </HTML>

或....有什么办法让它适合任何显示器的宽度？

Answer 1

您正在谈论所谓的“液体布局”，并且使用Photoshop切片布局无法实现。如果您想更改布局在浏览器中显示的方式，您需要学习一些HTML和CSS。

如何修复页面宽度缩小到屏幕大小？

1 个答案: