Question

我遇到了 Firefox 和 Chrome 浏览器之间的问题，以及我正在处理的网站的标题。此标头由- [ -z "$ZSH_VERSION" ] || [[ -o PROMPT_SUBST ]] || ps1_expanded=no + [ -z "${ZSH_VERSION-}" ] || [[ -o PROMPT_SUBST ]] || ps1_expanded=no ^ - [ -z "$BASH_VERSION" ] || shopt -q promptvars || ps1_expanded=no + [ -z "${BASH_VERSION-}" ] || shopt -q promptvars || ps1_expanded=no组成，其中包含一行五列，每个单元格中还有五个图像。当我使用Firefox浏览它时一切都很好但是在Chrome中看起来很糟糕!!!

Here是一个jsfiddle示例...首先用Firefox然后用Chrome打开它，你会看到我的意思。

HTML代码示例：

table

CSS代码示例：

<body>
    <table border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td><img src="https://lh3.googleusercontent.com/-G77gAVEAJp0/V4DD8-FTVDI/AAAAAAAAAIc/R-2o3WPNCIMCerkHw3WtgAjggU4aDpmPQCCo/h423/1.png" alt="" height="" width=""/></td>
            <td><img src="https://lh3.googleusercontent.com/-nz4se8JDQbI/V4DD80YrdkI/AAAAAAAAAIg/GlqXDawh4cQLsq9M7hs3o425WYnk_Y_pwCCo/h423/2.png" alt="" height="" width=""/></td>
            <td><img src="https://lh3.googleusercontent.com/-ME4eiHfFCX0/V4DD83Ch1SI/AAAAAAAAAIk/n8jzIfpt08EckyGkLGovVZ_daASbnZphwCCo/h423/3.png" alt="" height="" width=""/></td>
            <td><img src="https://lh3.googleusercontent.com/-tjmxMwltAQk/V4DD9KIY_xI/AAAAAAAAAIo/Tgyg1Jn08NYyyDF6wO-3g5pJ99su1yKUgCCo/h423/4.png" alt="" height="" width=""/></td>
            <td><img src="https://lh3.googleusercontent.com/-1bidacvkedc/V4DD9G7jsYI/AAAAAAAAAIs/D4Xnt38y6UgyQ-BwnfHflXUtQ4AraoFegCCo/h423/5.png" alt="" height="" width=""/></td>
        </tr>
    </table>
    <div class="menu">&nbsp;</div>
</body>

欢迎任何形式的帮助!!!

Answer 1

HTML

<body>
        <ul>
            <li><img src="https://lh3.googleusercontent.com/-G77gAVEAJp0/V4DD8-FTVDI/AAAAAAAAAIc/R-2o3WPNCIMCerkHw3WtgAjggU4aDpmPQCCo/h423/1.png" alt="" height="" width=""/></li>
            <li><img src="https://lh3.googleusercontent.com/-nz4se8JDQbI/V4DD80YrdkI/AAAAAAAAAIg/GlqXDawh4cQLsq9M7hs3o425WYnk_Y_pwCCo/h423/2.png" alt="" height="" width=""/></li>
            <li><img src="https://lh3.googleusercontent.com/-ME4eiHfFCX0/V4DD83Ch1SI/AAAAAAAAAIk/n8jzIfpt08EckyGkLGovVZ_daASbnZphwCCo/h423/3.png" alt="" height="" width=""/></li>
            <li><img src="https://lh3.googleusercontent.com/-tjmxMwltAQk/V4DD9KIY_xI/AAAAAAAAAIo/Tgyg1Jn08NYyyDF6wO-3g5pJ99su1yKUgCCo/h423/4.png" alt="" height="" width=""/></li>
            <li><img src="https://lh3.googleusercontent.com/-1bidacvkedc/V4DD9G7jsYI/AAAAAAAAAIs/D4Xnt38y6UgyQ-BwnfHflXUtQ4AraoFegCCo/h423/5.png" alt="" height="" width=""/></li>
        </ul>
    <div class="menu">&nbsp;</div>
</body>

CSS

body {
 background-color:rgb(255,0,0); 
 }

 ul {
   list-style-type:none;
   margin:0;
   padding:0;
   display:flex;
 }

 img {
 max-width: 100%;
 height: auto;
 vertical-align: middle;
 border: 0;
 }

.menu {
 background-color:rgb(239,239,239);
 }

LINK

https://jsfiddle.net/5dyqqsv7/

Firefox和Chrome浏览器之间的表格问题

1 个答案: