如何將圖像移動到li manu的右側？

嵌入<a>標記的圖像和我寫的float:right;但它不起作用。

我不知道爲什麼，我需要幫助，非常感謝。

<ul id="menu"> 
        <li><a href="index.html">home</a></li> 
        <li><a href="learnmore.html">פרטים נוספים</a></li> 
        <li><a href="services.html">learnmore</a></li> 
        <li><a href="about_us.html">about_us</a></li> 
        <li><a href="prices.html">prices</a></li> 
        <li><a href="location.html">location</a></li> 
      </ul> 
* { 
    margin:0; padding:0; 
    border:0; diraction:rtl; 
} 
body{ 
    text-align:right; 
    font-family:Arial; 
    font-size: 20px; 
    border:1px solid red; 
    font:13px Arial, Helvetica, sans-serif; color:#a7a7a7; 
    line-height:20px 
} 
#menu { width:100%; 
     border: 5px solid green; 
     padding:18px 30px 0 0; border-bottom:1px solid #e2e2e2;} 
#menu li { 
    border: 5px solid brown;float:right;padding-right:30px;} 
#menu li a{ 

    right:0; 
text-transform:uppercase; text-decoration:none; 
color:#2c2c25; font-size:18px; line-height:20px; 
    float:right; right:0; 
    background:url(http://t0.gstatic.com/images?q=tbn:ANd9GcRP4bAv-ruMbgWa8rTLZhWOITQk6aGOI8L_YMrmsRbacuIR502w) 
    7px 1px no-repeat; 

}

來源

2012-10-16 yossi

在li中使用background-position: right;。

#menu li { 
border: 5px solid brown;float:right;padding-right:30px; 
background:url(http://t0.gstatic.com/images?q=tbn:ANd9GcRP4bAv-ruMbgWa8rTLZhWOITQk6aGOI8L_YMrmsRbacuIR502w) 
7px 1px no-repeat; 
background-position: right; 
    }

演示jsfiddle

來源

2012-10-16 07:03:27 Selvamani

您添加這種風格的

a{ 
    display:block; 
}

，並刪除right:0

來源

2012-10-16 07:02:22

想想，你會想嘗試

background-position:right;

對於#menu li。

來源

2012-10-16 07:03:25

背景速記是錯誤的，儘量

background:url(http://t0.gstatic.com/images?q=tbn:ANd9GcRP4bAv-ruMbgWa8rTLZhWOITQk6aGOI8L_YMrmsRbacuIR502w) 
    no-repeat center right;

Working Demo用最少的CSS

Reference

來源

2012-10-16 07:03:50 diEcho

您的圖片本身並不是一個標籤，因爲你把它作爲鏈接的背景圖像，這就是爲什麼float:right不起作用。所以你需要：

background:url("http://t0.gstatic.com/images?q=tbn:ANd9GcRP4bAv-ruMbgWa8rTLZhWOITQk6aGOI8L_YMrmsRbacuIR502w") top right no-repeat;

定位圖像。或者如果您願意，可以撥打bottom right。

來源

2012-10-16 07:04:24

像這樣：

background:url(http://t0.gstatic.com/images?q=tbn:ANd9GcRP4bAv-ruMbgWa8rTLZhWOITQk6aGOI8L_YMrmsRbacuIR502w) 
**right** 1px no-repeat;

我在後臺更改了「7px的」到「右」，這意味着它將水平放置它的權利，並從頂部1個像素。

來源

2012-10-16 07:04:33 Jockelicious

上#menu li a上#menu li和padding-right:15px;添加background-position:right;，並調整墊襯，用類似padding-right:10px;上#menu li a。

你可以在這裏看到它： http://jsfiddle.net/5gGum/29/

來源

2012-10-16 07:13:06 Pato

如何將圖像移動到li manu的右側？

回答

相關問題