2017-05-30 115 views
0

爲了讓我可以嘗試一些不同的佈局/設計等,請幫助我如何逐一獲取單列中的所有項目符號。列中的HTML項目符號列表

enter image description here

請參閱上面的圖片我怎麼想它的樣子。在一行上的所有項目符號貫穿整個頁面。

下面是我現在擁有的以及我希望以均勻分佈在整個頁面上的項目符號顯示的內容。

<a href="http://stores.ebay.co.uk/Signware/For-Walls-/_i.html? 
_fsub=1806276619&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" 
style="color:#000000">- Wall Display Systems 

<a href="http://stores.ebay.co.uk/Signware/For-Windows-/_i.html? 
_fsub=1806276419&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" 
style="color:#000000">- Window Display Systems 

<a href="http://stores.ebay.co.uk/Signware/For-Ceilings-/_i.html? 
_fsub=1806276519&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" 
style="color:#000000">- Ceiling Display Systems 

<a href="http://stores.ebay.co.uk/Signware/For-Floors-/_i.html? 
_fsub=1806276719&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" 
style="color:#000000">- Floor Display Systems 

<a href="http://stores.ebay.co.uk/Signware/Merchandising- 
Accessories-/_i.html?_fsub=1806276819&_sid=1601798509&_trksid=p4634.c0.m322" 
target="_blank" style="color:#000000">- In-Store Displays 

<a href="http://stores.ebay.co.uk/Signware/Signware-Exlusive-/_i.html? 
_fsub=1806280119&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" 
style="color:#000000">- Signware Exclusive 
</a></p> 

我可以做正常的垂直BP,但不在列中。

+0

可能重複的[我可以使用CSS來添加項目符號點到任何元素?](https://stackoverflow.com/questions/32039846/can-i-use-css-to-add-a-bullet-指向任何元素) – demo

+0

也是https://stackoverflow.com/questions/976897/how-to-style-the-ul-list-to-a-single-line – Daz

回答

0

您可以使用float得到這個:

ul li { 
 
    float: left; 
 
    margin-right: 25px; 
 
}
<ul> 
 
    <li><a href="#">Item 1</a></li> 
 
    <li><a href="#">Item 2</a></li> 
 
    <li><a href="#">Item 3</a></li> 
 
    <li><a href="#">Item 4</a></li> 
 
    <li><a href="#">Item 5</a></li> 
 
</ul>

注意margin-right我補充說。

0

就試試這個:

<style> 
    div { 
     width: 600px; 
     margin: auto; 
    } 

    li { 
     display: inline-block; 
} 
</style> 

<div> 
    <ul> 
    <li><a href="http://stores.ebay.co.uk/Signware/For-Walls-/_i.html?_fsub=1806276619&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" style="color:#000000">Wall Display Systems</a></li> 
    <li><a href="http://stores.ebay.co.uk/Signware/For-Windows-/_i.html?_fsub=1806276419&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" style="color:#000000">Window Display Systems</a></li> 
    <li><a href="http://stores.ebay.co.uk/Signware/For-Ceilings-/_i.html?_fsub=1806276519&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" style="color:#000000">Ceiling Display Systems</a></li> 
    <li><a href="http://stores.ebay.co.uk/Signware/For-Floors-/_i.html?_fsub=1806276719&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" style="color:#000000">Floor Display Systems</a></li> 
    <li><a href="http://stores.ebay.co.uk/Signware/Merchandising-Accessories-/_i.html?_fsub=1806276819&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" style="color:#000000">In-Store Displays</a></li> 
    <li><a href="http://stores.ebay.co.uk/Signware/Signware-Exlusive-/_i.html?_fsub=1806280119&_sid=1601798509&_trksid=p4634.c0.m322" target="_blank" style="color:#000000">Signware Exclusive</a></li> 
    </ul> 
</div> 

<li>屬性將產生的子彈,和inline-block的將李的旁邊躺了對方。 <div>屬性使文本浮動在中心。

相關問題