# 基本類型 Link Block

 

![](https://i.imgur.com/pTMaCmp.png)

![](https://i.imgur.com/OPAES7t.png)

Link Block 與 DivBlock 類似，可以用於結構和佈局，但 Link 內部的區域變成了鏈接。鏈接可以將任何元素（如圖像）或任何佈局（如橫幅）轉換為鏈接。

![](https://i.imgur.com/GB9LPFf.png)

#### 添加鏈接

要將鏈接添加到您的項目中，請打開左側邊欄中的元素面板（快捷方式：A），然後將鏈接塊元素拖到您的頁面上。

![](https://i.imgur.com/xqD1yit.png)

任何元素都可以從添加到面板或畫布拖到“鏈接”中。

![](https://i.imgur.com/Jnt8S0m.png)

#### 設置鏈接類型和其他

與文本鏈接和按鈕一樣，Link Block 具有相同的鏈接選項 — URL、頁面、集合頁面、部分頁面、電子郵件、電話和文件等。

![](https://i.imgur.com/9ZTS3pz.png)

#### 設置 Link Block 的 hover 狀態

Link Block 通常都是有一點交互式動畫的，因此最好在鏈接塊上設置不同的懸停狀態以向用戶顯示它是可點擊的。按照以下步驟設置懸停狀態的樣式：

1. 選擇 Link Block
2. 點擊 states 並選擇 Hover
3. 添加框陰影或任何其他樣式屬性
4. 轉到無/默認狀態
5. 為框陰影屬性或您在懸停狀態下設置樣式的任何其他樣式屬性創建過渡

![](https://i.imgur.com/N7XTooY.png) ![](https://i.imgur.com/qHikPOW.png)

#### 更改 Hover時的背景圖像：

1. 將背景圖像添加到 Link Block
2. 轉到狀態 > 懸停
3. 更改背景圖片
4. 轉到無/默認狀態
5. 為 背景圖像 屬性創建 過渡

#### 覆蓋藍色文本

默認情況下，當任何文字放置在 Link Block 內時，它會顯示為藍色並帶有下劃線，因為這是 All links 標籤上的默認文字樣式。

你可以通過覆蓋文本裝飾和字體顏色來更改特定鏈接塊上的默認鏈接樣式：

1. 選擇鏈接塊
2. 轉到樣式面板
3. 將文本裝飾更改為無
4. 將字體顏色更改為黑色

![](https://i.imgur.com/9ELXVBD.png)

#### 將 Div Block 轉換為 Link Block

點選Div Block單極右鍵即可轉換成 Link Block，反之亦然。

![](https://i.imgur.com/9vxEk4D.png)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.tenten.co/docs-webflow/webflow-101/4-yuan-su-de-lei-xing/ji-ben-lei-xing-link-block.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.