我應該如何在旁邊添加這個箭頭？

a.arrow::after { 
    display:block; 
    content: ""; 
    width: 63px; 
    height: 59px; 
    background-image: url(../../img/arrow.png); 
    position: relative; 
    background-repeat: no-repeat; 
}

如何把箭頭放在我們旁邊？我應該如何在旁邊添加這個箭頭？

aroow

navigation

來源

2017-03-13 online work

是否箭頭做任何事情，或者是它只是擺設？請編輯您的問題以包含您的標記（[snippet]（https://stackoverflow.blog/2014/09/16/introducing-runnable-javascript-css-and-html-code-snippets/）將會更可取。） –

你可以把它們放在一個無序列表，無需設置寬度和高度，只需設置填充，如果你希望他們有同樣的表現和排隊;如果你想使用僞，那麼我建議使用行高，如果你知道他們將永遠不會換行。

嘗試這樣的事情，適應適應：

.inline-list { 
 
margin: 0; 
 
padding: 0; 
 
list-style: none; 
 
} 
 

 
.inline-list li { 
 
display: inline-block; 
 
padding: 1em 2em; 
 
background: aqua; 
 
}

<ul class="inline-list"> 
 
<li>About Us</li> 
 
<li>></li> 
 
</ul>

來源

2017-03-13 18:20:35

非常感謝你 –

試試這個辦法：您可以根據您的需要設置箭頭的位置。

.sp{ 
 
\t display: flex; 
 
\t justify-content: center; 
 
} 
 
.p li{ 
 
\t list-style-type: none; 
 
} 
 
.p{ 
 
\t display: flex; 
 
\t width: 70%; 
 
    justify-content: space-between; 
 
} 
 

 
.icon_p{ 
 
\t position: relative; 
 
} 
 

 
.icon:after{ 
 
\t content: '▼'; 
 
\t position: absolute; 
 
\t left: 65px; 
 
\t top: 0px; 
 
\t right: 0px; 
 
\t bottom: 0px; 
 
}

<div class="sp"> 
 
    <div class="p"> 
 
     <li><a href="#">Portfolio</a></li> 
 
     <li class="icon_p"><a href="#" class="icon">About</a></li> 
 
     <li><a href="#">Blog</a></li> 
 
     <li><a href="#">GetInTouch</a></li> 
 
    </div> 
 
</div>

來源

2017-03-13 19:03:42

我應該如何在旁邊添加這個箭頭？

回答

相關問題