有鑑於某些文章太過冗長,想要在上方放一些類似目錄、索引類的東西

直接讓使用者到達想到的地方,但又不分頁

知道有「錨點」這功能後,想要放在文章中試試看

 

先講結論:錨點是一個你要到達的地方,所以下錨在那個定位

該怎麼去呢?使用超連結,超連結會去找你下錨的地方

然後記得考慮一件事情:下錨的位置會在螢幕最上方,所以適度調整錨點上移幾行,以讓文章閱讀性更佳

 

整個實驗流程:

但個人並不會 HTML 及 CSS 語法

請教了同事後,也教了我使用

<p><a id="top_1"></a></p>

<p><a href="#top_1">go to top</a></p>

這組語法,錨點就是 a id="" 這組,你要命名你的錨點在引號內

a href="#" 就是超連結,記得有井字。當然#後接的名稱要跟錨點的命名一致

在 <a> </a> 中間的字,是超連結用什麼詞彙呈現

 

我稍微使用了一下,但發現原始碼中有 CSS 叢林

我隨便擺了一個位置之後,發現文章段落的呈現會亂掉

所以就決定改用內建的功能鍵試試

 

功能列中,有個旗子的標誌,那就是錨點功能鍵

旁邊是超連結,直到現在我才知道他們搭在一起是有意義的

把文字游標移到你想要放置錨點的地方,直接點該功能鍵

接下來會請你命名該錨點,以便接下來超連結時可以找到相對應的地方

按下確認後,游標處就會出現旗子標誌

旗子標誌是可以直接用滑鼠拖曳移動的喔!

 

然後找到你想要超連結到錨點的那個字串,反白選取起來

點選超連結功能鍵,會出現一個對話框

看「連結類型」,選擇裡面的文字中的錨點連結

你剛才有幫錨點取了名字,所以在「選取一個錨點中」的依錨點名稱中找到它

選擇它並按確認,並在文章編輯完後儲存文章

 

這樣事情其實已經結束完成了~~

最後就只要到文章中測試

點選剛才設好的超連結是否會跑到下錨點的地方(下錨點的地方會跑到螢幕最上方)即可

成功就是沒有弄錯!

 

-Fin-

arrow
arrow
    文章標籤
    pixnet 錨點 超連結
    全站熱搜
    創作者介紹
    創作者 答詩町派迪 的頭像
    答詩町派迪

    達斯丁派迪的二壘防區

    答詩町派迪 發表在 痞客邦 留言(1) 人氣()