如何將選項標簽鏈接到html中的其他頁面？

Question

我在鏈接頁面時遇到困難。 嘗試過我所知道的所有技巧（基礎知識，因為我剛開始學習網頁設計實際上是一個平面設計師而且我只有html和css的基本知識我在js或php中沒有任何線索，其余的。只是為了讓你知道。）但沒有任何工作。 希望你猜可以幫助我。 以下是代碼..

    <div class="fleft">
        <ul id="cd-dropdown" class="cd-select">
            <option value="-1" selected>OUR SERVICES</option>
            <option class="icon-corporate">Corporate Branding</option>
            <option class="icon-logo">Logo Designing</option>
            <option class="icon-webdesign">Web Designing</option>
            <option class="icon-camera">Photography</option>
            <option class="icon-video">Video Editting</option>
            <option class="icon-art">Illustration</option>
            <option class="icon-work">Graphic Design</option>
        </ul>
    </div>

Answer 1

首先，您是否嘗試使用下拉框或列表？

對於下拉列表，如本問題中所述 ，您可以使用JavaScript執行以下操作。 使用onChange事件指定更改選擇框的值時要執行的操作。 然后使用window.location告訴瀏覽器導航到特定頁面。

<select onChange="window.location.href=this.value">
    <option value="www.google.com">A</option>
    <option value="www.aol.com">B</option>
</select>

對於列表，只需稍微更改語法即可。 使用無序列表，然后根據自己的喜好設置樣式。

<ul>
    <li><a href="www.google.com"">A</a></li>
    <li><a href="www.aol.com">B</a></li>
</ul>

Answer 2

你不能將它們本身鏈接起來。

如果你想要一個鏈接列表，那么你應該有一個實際的鏈接列表：

<ul>
    <li><a href="...">...</a></li>
    <li><a href="...">...</a></li>
</ul>

如果您想使用選擇菜單，那么您應該注意：

1. 它旨在用作表單的一部分
2. 它對搜索引擎來說相對不友好
3. 它提供的UI不向用戶表明它是導航工具

然后（注意步驟4及以后是可選的）：

1. 添加表單並刪除無序列表
2. 添加<input type="submit" value="Go">按鈕
3. 編寫服務器端程序（在表單的action屬性中引用），檢查select的值是什么，然后輸出302 Found HTTP狀態和Location頭以及您希望瀏覽器轉到的URL。
4. 添加一個JavaScript事件處理程序（在表單的submit事件或select的change事件中）
5. 讓它檢查所選選項的值
6. 將location屬性設置為所需的目標
7. 取消表單的默認行為

Answer 3

如果你使用ul創建菜單，你可以使用相同的

 <div class="fleft">
            <ul id="cd-dropdown" class="cd-select">
                <li value="-1" selected>OUR SERVICES</li>
                <li class="icon-corporate">Corporate Branding</li>
            </ul>
        </div>

如果你需要下拉，你應該使用

<select>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>