簡體   English   中英

在Photoshop中保存為網頁切片頁面在IE中看起來很糟糕

[英]Saved for web in Photoshop sliced page looks bad in IE

我通過Photoshop制作了網頁,將其切片並保存為網頁並上傳了html文件。 它在Firefox和Chrome中看起來很不錯,但IE卻完全不同。 任何人都知道如何解決它以及為什么我得到這個黑色填充?

IE:

IE

Firefox, Chrome & Safari: 

火狐

碼:

<html>
<head>
<title>Shamir Applications</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1255">
</head>
<body bgcolor="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (Webpage08.psd) -->
<table id="Table_01" width="960" height="720" border="0" cellpadding="0" cellspacing="0"  style="margin-right: auto; margin-left: auto;">
    <tr>
        <td colspan="11">
            <img src="images/Webpage08_01.png" width="960" height="237" alt=""></td>
    </tr>
    <tr>
        <td rowspan="6">
            <img src="images/Webpage08_02.png" width="130" height="483" alt=""></td>
        <td>
            <img src="images/Webpage08_03.png" width="138" height="36" alt=""></td>
        <td rowspan="6">
            <img src="images/Webpage08_04.png" width="142" height="483" alt=""></td>
        <td colspan="3">
            <img src="images/Webpage08_05.png" width="138" height="36" alt=""></td>
        <td rowspan="6">
            <img src="images/Webpage08_06.png" width="140" height="483" alt=""></td>
        <td colspan="3">
            <img src="images/Webpage08_07.png" width="138" height="36" alt=""></td>
        <td rowspan="6">
            <img src="images/Webpage08_08.png" width="134" height="483" alt=""></td>
    </tr>
    <tr>
        <td rowspan="5">
            <img src="images/Webpage08_09.png" width="138" height="447" alt=""></td>
        <td colspan="3">
            <img src="images/Webpage08_10.png" width="138" height="13" alt=""></td>
        <td colspan="3">
            <img src="images/Webpage08_11.png" width="138" height="13" alt=""></td>
    </tr>
    <tr>
        <td rowspan="2">
            <img src="images/Webpage08_12.png" width="14" height="146" alt=""></td>
        <td>
            <img src="images/Webpage08_13.png" width="110" height="110" alt=""></td>
        <td rowspan="2">
            <img src="images/Webpage08_14.png" width="14" height="146" alt=""></td>
        <td rowspan="4">
            <img src="images/Webpage08_15.png" width="16" height="434" alt=""></td>
        <td>
            <img src="images/Webpage08_16.png" width="110" height="110" alt=""></td>
        <td rowspan="4">
            <img src="images/Webpage08_17.png" width="12" height="434" alt=""></td>
    </tr>
    <tr>
        <td>
            <img src="images/Webpage08_18.png" width="110" height="36" alt=""></td>
        <td rowspan="3">
            <img src="images/Webpage08_19.png" width="110" height="324" alt=""></td>
    </tr>
    <tr>
        <td colspan="3">
            <img src="images/Webpage08_20.png" width="138" height="17" alt=""></td>
    </tr>
    <tr>
        <td colspan="3">
            <img src="images/Webpage08_21.png" width="138" height="271" alt=""></td>
    </tr>
</table>
<!-- End Save for Web Slices -->
</body>
</html>

嘗試將其放入您的css文件中

img {
   border:0;
   padding:0;
   margin:0;
}

或者在頭標簽寫

<style type="text/css">
    img {
       border:0;
       padding:0;
       margin:0;
    }
</style>

您可以嘗試從使用表格模式切換到使用css導出嗎?

關於Matei Mihai的答案你也應該加上這個:

img {
   border:0;
   padding:0;
   margin:0;
   display:block; /* This often removes extra spacing around images in IE */
}

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM