【網頁設計教學│勞動學苑版】04.相片超連結，文案與超連結按鈕，資料排序，水平線，CSS美化文字，版權宣告和回到頁面頂端│國平老美工網頁設計x教學 (附CC中文字幕)@kuopingsir

超連結 (Hyperlinks)真的超級重要 — 它造就了我們現今所熟知的網路。 這篇文章將會介紹超連結的使用語法，並且探討建立它們的最佳實踐方法。

超連結是建立網頁與網頁之間的關係，也可以連結到外部網站。 a是Anchor的縮寫，中文翻譯為「錨」，點擊後跳到指定位置。

通常在設計網頁的超連結時，不外乎都是使用文字顏色或背景色，進而搭配 transition 製作簡單的轉場，但如果熟練運用 CSS，就能做出更與眾不同的效果，這篇教學會使用 CSS 製作多種底線效果，除了有基本的變色和轉場，也會使用漸層色、動畫、SVG 製作別具特色 ...

指定在什麼地方打開連結。 target 有下面這些屬性值： 1. _self: 預設值，在當前視窗開啟 2. _blank: 在新視窗開啟 3. _parent: 在上一層父視窗開啟 4. _top: 在最頂層父視窗開啟 5. framename: 指定在哪個框架中開啟 舉例： 上面這例子的結果： 在「fooish.com」查看更多資訊 指定當前頁面和連結目標彼此之間的關係。 rel 有下面這些屬性值： 1. nofollow: 禁止搜尋引擎 (Google) 將該連結與你的網頁關聯在一起，或禁止從你的

CSS的連結樣式可以針對網頁中的連結，依據使用狀態提供不一樣的效果，能夠讓原本單純的連結有更多視覺上的變化，可以設定的屬性像是文字顏色、字型、粗細等等。

CSS a 連結樣式效果設計可以提供網頁內的連結（a href）在被使用時的效果，例如滑鼠移到某一條連結上，讓連結產生不同的顏色，或是標注網友已經看過的連結為不同顏色，這些都可以利用 CSS 提供的 a 連結樣式設計功能來處理，讓原本一成不變的連結有了更多 ...