我想弄清楚如何將導航菜單欄中的標題鏈接到單擊文本時的任何URL。當我將<a href>標籤放在它的周圍時，標題就會出現在屏幕左側並更改顏色，並收到下劃線。我怎樣才能保持標題的方式，但鏈接到一些網址？如何將導航菜單中的標題與網址鏈接？

<style> 
    body {margin:0;} 
    .Header { 
     z-index: 100; 
     position: fixed; 
     top: 0; 
     width: 100%; 
     background-color: #000000; 
     height: 70px; 
    } 

    @media screen and (max-width:680px) { 
     .Header.responsive {position: relative;} 
     .Header.responsive li.icon { 
      position: absolute; 
      right: 0; 
      top: 0; 
     } 

    } 
    @media (max-width: 960px){ 
    .Header .headerLogo{ 
     position: relative; 
     display: flex; 
     width: 86px; 
     height: 15px; 
     margin: 0 auto; 
    } 
    } 
    .headerLogo{ 
     text-align: center; 
     font-size: small; 
     font-style: italic; 
     font-family: Verdana; 
     color: white; 


    } 
</style> 
<body> 

<div class="Header" id="myHeader"> 
    <a class = "headerLogo"> 
     <h1>Lunation Boards</h1> 
    </a> 
</div> 
</body> 
<body>

所以我更新了我的代碼，但我得到在鼠標變成手的問題（點擊標題）在整個導航菜單欄，而不是僅僅在標題。代碼如下。

<div class="Header" id="myHeader"> 
     <a class = "headerLogo"> 
      <a href="file:///C:/Noah's%20stuff/LunationBoards/Home.html" ><h1 style="color:white; font-family: Verdana; font-style: italic; font-size: x-large; 
      text-align: center;">Lunation Boards</h1></a> 
      <style> 
       a{text-decoration: none} 
      </style>

來源

2017-02-24 Noah Tanenholtz

你不能有一個''元素作爲另一個''元素的後裔。 –

把一個元素內 h1元素：

<h1 class="headerLogo"> 
    <a href="https://www.facebook.com">Lunation Boards</a> 
</h1>

來源

2017-02-24 03:23:25

那麼我會怎麼鏈接讓說，facebook.com？ –

我將編輯答案 –

問題是，一旦我這樣做，它會將標題顏色更改爲紫色並強調它，並將其對齊到左側而不是中心 –

瀏覽器將應用某些樣式默認鏈接。爲了擺脫下劃線，您可以使用text-decoration: none，然後您可以使用color: #000或任何其他想要的顏色來設置顏色。

CSS

.headerLogo { 
    text-decoration: none; 
    color: whatevercolouryouwant; 
    etc: etc; 
}

來源

2017-02-24 04:39:19 Anthony

如何將導航菜單中的標題與網址鏈接？

回答

CSS

相關問題