简体   繁体   中英

How can I fix the page width to shrink to the screen size?

I sliced a PSD, and Photoshop puts the the code all in tables. I use it like that cuz I don't know much about coding. The website looks good, but I'm running with the problem that I have to scroll to the sides (left and right) cuz I made the website 1681 pixels wide and that's bigger than my monitor. Is there any way I can "shrink" everything using html or maybe css, so I don't have to redesign so it fits the browsers or monitor's "width" ?

more or less.. all I got is just a table, with some stuff in it.

<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>

or .... is there any way so it fits the width of any monitor?

You're talking about what's called a "liquid layout", and it's not possible with Photoshop-sliced layouts. If you want to change anything about the way your layouts display in browsers, you'll need to learn some HTML and CSS.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM