HTML / CSS按鈕鏈接不起作用

Question

我正試圖在我使用CSS制作的這個按鈕內放置一個鏈接到我網站的另一個頁面。 但是，該按鈕已經在其中設置了格式化文本，並且鏈接顯然僅在我在<a></a>標記內使用文本時才有效。 任何想法如何讓整個按鈕成為可點擊的鏈接？ 這是有問題的代碼：

<nav>
<p class="button"><a href="pictures.htm"></a>Pictures of our destinations</p>
<p class="button">Prices for flights, hotels and all in one deals</p>
<p class="button">Today's deals</p>
<p class="button">Contact us!</p> 
<p class="button">Sign up for an account</p>
</nav>

該代碼代表，鏈接不起作用，沒有可點擊的區域。 但是，將文本從<p>標記移動到<a>標記會使鏈接起作用，但我的CSS格式不適用於它。

Answer 1

你需要這樣做

<a href="pictures.htm" class="button">Pictures of our destinations</a>

您需要將內容放在可點擊a標記內

現在按下按鈕

.button{    
/*.......

Your button style properties

.........*/        
}

Answer 2

<a href="pictures.htm" class="button">Pictures of our destinations</a>而不是第一段

Answer 3

您可以直接添加class="button" <a>標簽的樣式並刪除<p>標簽。

<a class="button" href="pictures.htm">Pictures of our destinations</a>

Answer 4

刪除<p>標記將解決您的問題：

<a href="pictures.htm" class="button">Pictures of our destinations</a>

使用您自己的CSS類：

.button {
    border: none;
    background-color: #e7e7e7;
    color: black;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
}