href超文本引用
語法href是什麼？href基礎應用與解說｜天矽科技客製化網頁設計
網頁語法中的href是什麼
href 全名為 Hypertext Reference 超文本引用。它的作用是指定超連結目標的URL(連結)，簡單來說就是連結路徑的意思。
大多時候，我們看到href前面通常都會有個＜a＞標籤，這個 a 代表連結的意思，當然也會有人稱 a 為link，但都是相同的功能與意義。
a href="連結"
比如「超連結」我們就會這樣寫：
＜a href="www.某個網址.com.tw" target="_blank"＞我要顯示的字＜/a＞
或是
＜a href=" www.某個網址.com.tw” title="游標顯示文字"＞我要顯示的字＜/a＞
※ 這裡的 target="_blank" 表示在新視窗中開啟，若為 target="_self" 則表示在原本的視窗開啟，另外 title=" 表示連結標題，在連結後方加入這種類型的標籤，語法才更有意義，不過在此不多做贅述。
※ 有時候我們也會看到網址語法寫成＜link href="連結" /＞，這裡的link作用則是引入CSS檔案。
href="#"
有時我們也會看到href寫成「href="#"」這代表什麼意思？ 寫成 # 不代表沒寫好，這是表示這是跳轉到目前頁面、連到任何書籤的意思。
若後面沒有加任何連結，像是＜a href="#"＞這樣，也不代表連不到任何連結，這樣的方式一樣能連結到網頁本身，只是連結目的地還是在本頁面，通常是做JavaScript效果才會這樣做。
這個語法我們稱它為「空址」，在架設無障礙類型的網站時，是不能有這個語法出現的，因為這樣會被判定為無效網址，所以如果一定要加入這項空址，請寫成＜a href="javascript:;"＞。
總而言之，href的作用就是連結的意思。
網頁中的href用法
內部與外部連結
＜a href="連結網址"＞字字字＜/a＞
舉例
＜a href="https://www.tsg.com.tw/works6.htm"＞天矽作品集＜/a＞
顯示：天矽作品集
連結外部文件
想要讓使用者直接點選超連結就能下載文件，同樣能使用href連結。
＜a href="/XXX.doc"＞字字字＜/a＞
舉例
＜a href="/XXX.doc"＞點此下載＜/a＞
顯示：點此下載
目錄錨點
有些較長的文章，在文章一開始會放上目錄，讓使用者能快速找到想看的章節，這部分也能利用href連結連到錨點上。
＜a href="#對應的id標籤碼"＞章節標題＜/a＞
舉例
(因為我們沒有設定目錄，所以以語法呈現。)
- 目錄其中之一：
＜a href="#1"＞對應章節標題＜/a＞ - 對應連結錨點：
＜h3 id="1">文章章節標題＜h3＞
麵包屑建立
＜ol＞
＜li＞＜a href="區域連結網址_第一層"＞麵包屑文字＜/a＞＜/li＞
＜li＞＜a href="區域連結網址_第二層"＞麵包屑文字＜/a＞＜/li＞
＜li＞＜a href="區域連結網址_第三層"＞麵包屑文字＜/a＞＜/li＞
＜/ol＞
舉例
▲羅東博愛醫院麵包屑（前台顯示）
▲羅東博愛醫院麵包屑（後台語法）
外部CSS引用
＜link href="XXXX.CSS" rel="指定樣式"＞
連結href和src
有些人可能發現，不是還有 src 嗎？這兩個有什麼不一樣？
src全名source，意思是根源、來源的意思，而href則為超文本引用，雖然都能夠連結，但用途不同。
- href 用於a標籤、link標籤
- src 用於img標籤、script標籤、iframe標籤
像這樣：＜img alt="圖片表現文字" src="圖片網址" /＞
所以這兩者是不同的，本文不做贅述，但仍特別提醒大家！
天矽科技的服務
天矽科技在協助架設網頁時，會在網站建立路徑，以利使用者在網站中不迷路，而這裡的路徑建立也稱麵包屑建立(前台顯示)，也就是使用a屬性的href來達成目的。
而文章中的前台顯示連結也都採用＜a href="URL"＞的方式撰寫，使文章結構更加簡潔。
延伸閱讀
麵包屑是什麼？提升SEO的「路徑導覽」讓使用者不再迷路！
有其他想要了解的網站架設細節，歡迎向我們聯絡。
