嘗試在頁腳旁邊的海誓山盟移動文本

如何在我的頁腳旁邊移動文本？我試圖有3列彼此相鄰，現在我只有一列，我不知道如何得到旁邊的兩個人。嘗試在頁腳旁邊的海誓山盟移動文本

店和學習
的Mac

<br><a href="footer.html">iPad</a> 

    <br><a href="footer.html">iPhone</a> 

    <br><a href="footer.html">Watch</a> 

    <br><a href="footer.html">TV</a> 

    <br><a href="footer.html">Music</a> 

    <br><a href="footer.html">iTunes</a> 

    <br><a href="footer.html">iPad</a> 

    <br><a href="footer.html">Accessories</a> 

    <br><a href="footer.html">Gift Cards</a>

來源

2016-04-29 nick

嘗試column-count CSS屬性。檢查例如

<ul style="-webkit-column-count: 3;-moz-column-count: 3;column-count: 3;"> 
 
    <li><a href="footer.html">iPad</a> 
 
    </li> 
 
    <li><a href="footer.html">iPhone</a> 
 
    </li> 
 
    <li><a href="footer.html">Watch</a> 
 
    </li> 
 
    <li><a href="footer.html">TV</a> 
 
    </li> 
 
    <li><a href="footer.html">Music</a> 
 
    </li> 
 
    <li><a href="footer.html">iTunes</a> 
 
    </li> 
 
    <li><a href="footer.html">iPad</a> 
 
    </li> 
 
    <li><a href="footer.html">Accessories</a> 
 
    </li> 
 
    <li><a href="footer.html">Gift Cards</a> 
 
    </li> 
 
</ul>

來源

2016-04-29 04:31:07 Pugazh

首先之下，劃分鏈接...

<div class="linklist"> 
<a href="footer.html">iPad</a><br> 
<a href="footer.html">iPhone</a><br> 
<a href="footer.html">Watch</a><br> 
</div> 

<div class="linklist"> 
<a href="footer.html">TV</a><br> 
<a href="footer.html">Music</a><br> 
<a href="footer.html">iTunes</a><br> 
</div> 

<div class="linklist"> 
<a href="footer.html">iPad</a><br> 
<a href="footer.html">Accessories</a><br> 
<a href="footer.html">Gift Cards</a><br> 
</div>

然後風格！

.linklist { 
    width: 33%; 
    display: inline-block; 
}

展開css不過適合你，但這會得到三列之間的鏈接分裂。 :)

來源

2016-04-29 04:42:27

添加一些申報單的內容劃分，並添加一些CSS來保持一致的要求

<div class="col">  
     <a>content</a>  
     <a>content</a>  
     <a>content</a>  
    </div>  
    <div class="col">  
     <a>content</a>  
     <a>content</a> 
     <a>content</a> 
    </div>  
    <div class="col"> 
     <a>content</a> 
     <a>content</a>  
     <a>content</a> 
    </div>

現在設置CSS：

.col{ 
     width: 33%; 
     float: left; 
    } 
    .col a{ 
     float: left; 
     width: 100%; 
     margin: 2px; 
    }

我沒有測試，寫作在我的手機上。希望能幫助到你！

來源

2016-04-29 04:42:35

<a href="footer.html" class = "col1">iPad</a> 
    <a href="footer.html" class = "col2">iPhone</a> 
    <a href="footer.html" class = "col3">Watch</a> <br/> 
    <a href="footer.html" class = "col1">TV</a> 
    <a href="footer.html" class = "col2">Music</a> 
    <a href="footer.html" class = "col3">iTunes</a>

CSS樣式： .col1

{ 
       position: relative; 
       float: left; 
       margin-right: 50px; 
      } 
      .col2 
      { 
       float: left; 
       margin-right: 50px; 
      } 
      .col3 
      { 
       float: left; 
       margin-right: 50px; 
      }

希望這有助於。你可以在堆棧溢出以及谷歌中找到很多答案。

來源

2016-04-29 04:43:02

嘗試在頁腳旁邊的海誓山盟移動文本

回答

相關問題