我該如何改變這張照片？我希望創建html站點地圖

-1

before -> after

我該怎麼更換這張照片？我希望創建的HTML網站

這是我的代碼

<div class="sitemapcontainer"> 
<h1>Sitemap</h1> 

<ul> 
<li clas 



<style> 
.sitemapcontainer {max-width:1200px; width:100%; max-height:430px; height:100%;} 
.sitemapcontainer ul {list-style-type:none;display:block;max-width:151px;width:100%;} 
.lili {float:left; font-size:14px; border-bottom:1px solid #E7E7E7;width:100%; text-align:center; background-color:#F1F1F1;max-width:151px;width:100%;} 
.lititle {text-align:center; background-color:#05508b;color:#ffffff;border-right:1px ;solid #ffffff;max-width:151px;width:100%;} 
.lititle a {color:#ffffff;} 
.litltle a:hover {text-decoration:none; color:#be1c21;} 
</style>

來源

2016-03-15 이시우

哪個圖片？它完全不清楚。 – Manwal

只需添加下面的CSS：

.sitemapcontainer ul { 
    float:left; 
}

DEMO

如果您想自動調整，請使用此插件http://masonry.desandro.com/v2/。

來源

2016-03-15 06:28:06 Manwal

如果列沒有相同的高度，則這不起作用。看到這個：https://jsfiddle.net/Smartik/xw7e4avb/2/ –

@Smartik是正確的錯過了這一點。 – Manwal

最簡單的解決方案是使用CSS3列。它適用於大多數瀏覽器，包括IE 10+。

.sitemapcontainer{ 
    -webkit-column-count: 4; /* Chrome, Safari, Opera */ 
    -moz-column-count: 4; /* Firefox */ 
    column-count: 4; 
}

對於舊的瀏覽器可以使用填充工具，如： https://github.com/hamsterbacke23/multicolumn-polyfill

來源

2016-03-15 06:35:15

我該如何改變這張照片？我希望創建html站點地圖

回答

相關問題