Question

我正在尝试使用二十三个主题在wordpress网站上格式化一些图像。

这是我正在使用的代码

<style> 

    #fontContainer {
            font-size: 0px; 
            width: 958px; 
            margin: 0 auto;
            padding: 2px; 
            margin-top: 30px;
    } 

#fontContainer {
           font-size: 0px; 
           width: auto; 
           margin: auto;
           padding: 2px; 

 } 
    #frontContainer a { 
        margin: 6px; 
        display: inline-block;
        height: 150px;
        width: 150px; 
        float: left;
}

#frontContainer img { 
        height: 100%; 
        width: 100%; 
        border: 4px solid black;
        border-radius: 10px;
}
 </style>

<div id='frontContainer'>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/BowFrontDesk_pacificexpresscopy_zps7e8dc151.jpg'/></a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/corner_workstationcopy_zps1ff2c6b7.jpg'/> </a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/Corner_work_station_zps644dc92c.jpg'/> </a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/screen_4person_workstation_zps73078288.jpg'/></a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/Counter_reception_01_zps9b4c1fbe.jpg'/> </a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/home_office_desk_zps5a5737d9.jpg'/> </a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/chair_mesh_am100_zps582ba090.jpg'/> </a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/tamboor_cupboard_zps0e8c0f6c.jpg'/></a>
<a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/Screen_zps64d2ea85.jpg'/> </a>
    </div>

它应该是相当直接的，但在WP网站上，顶行的图像正在向下踩。我不知道为什么或如何解决它。

该网站是www.pacificexpress.com.au

如果有人能提供帮助，将不胜感激。

詹姆斯

Answer 1

由于wordpress中的自动格式化而导致其中断。您可以在源代码中看到“<br>”标签由wordpress生成。复制此HTML并粘贴到您的编辑器。基本上删除空格，以便“<br>”不会生成。

<div id='frontContainer'> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/BowFrontDesk_pacificexpresscopy_zps7e8dc151.jpg'/></a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/corner_workstationcopy_zps1ff2c6b7.jpg'/> </a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/Corner_work_station_zps644dc92c.jpg'/> </a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/screen_4person_workstation_zps73078288.jpg'/></a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/Counter_reception_01_zps9b4c1fbe.jpg'/> </a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/home_office_desk_zps5a5737d9.jpg'/> </a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/chair_mesh_am100_zps582ba090.jpg'/> </a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/tamboor_cupboard_zps0e8c0f6c.jpg'/></a> <a href='https://www.pacificexpress.com.au/shop'><img src='http://i105.photobucket.com/albums/m215/furnxfurniture/Photobucket%20Desktop%20-%20Jamess%20MacBook%20Air/Furnx%20Images/Front%20Page%20Images/Screen_zps64d2ea85.jpg'/> </a> </div>

Answer 2

你说得对，你的css选择器中只有拼写错误：

#fontContainer{

  }

应该是

#frontContainer{

  }

注意＆＃34; r＆＃34;

Wordpress二十三主题的基本图像网格问题

2 个答案: