具有5個圖像的水平導航欄，CSS

我需要一個帶有五個預製圖像的水平導航欄作爲鏈接。圖像高度相同但寬度不完全相同，所以我需要能夠微調每個圖像的水平位置和它們之間的間距，我不希望它們只是集中在左側或右側或居中。具有5個圖像的水平導航欄，CSS

我怎麼會去讓這個在CSS？我搜查了一下，據我瞭解，這對初學者來說是相當困難的。多個水平divs？顯示：表？

2015-01-09 roxunr

<html> 
<head> 
</head> 
<style type="text/css"> 
    #images ul li{ 
     display: inline; 
    } 
    #i1{ 
     background-color:red; 
     margin:20px; 
     padding:10; 

    } 
    #i2{ 
     background-color:red; 
     margin:20px; 
     padding:10; 

    } 
    #i3{ 
     background-color:red; 
     margin:20px; 
     padding:50; 

    } 
</style> 

<body> 

<div id="images"> 
<ul> 
    <li id="i1"> image1</li> 
    <li id="i2">image2</li> 
    <li id="i3">image3</li> 
    </ul> 
</div> 
</body> 
</html>

這是我編u可以使用，而不是文本圖像，並可以設置寬度和高度

來源

2015-01-09 23:12:13 Mobitips

使用這個網站：

<nav> 
<ul> 
<li><a href="page to which image links to"> <img src="img/one.png" alt="" class="image"></a></li> 

<li><a href="page to which image links to"> <img src="img/two.png" alt="" class="image"></a></li> 

<li><a href="page to which image links to"> <img src="img/three.png" alt="" class="image"></a></li> 

<li><a href="page to which image links to"> <img src="img/four.png" alt="" class="image"></a></li> 

<li><a href="page to which image links to"> <img src="img/five.png" alt="" class="image"></a></li>

然後把把這個成CSS：

nav ul{list-style: none;}

你會擺脫子彈點。

來源

2015-01-10 20:17:27 Jana

具有5個圖像的水平導航欄，CSS

回答

相關問題