Html 基本說明（07）-如何在迅速找到主題-增加錨點 @ 雲橙雨林

我們在同一頁中，因文章內容很多，捲軸一直向下拉，拉到最下面後，又要用滑鼠將捲軸拉上，雖然已有滑鼠滾輪的幫助，有時候是非必要用錨點的方式，但並不代表他已失去了功用，有時候，在寫很多文章時，並非有滾軸可以找到你要的主題，為了方便使用者找到他要的資訊，我們有時候，還是用錨點的方式，協助使用者來找到他要的資料，以下就來介紹如何編寫！

錨點的寫法

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

a 是連結，設一個id 名字為top_1(可自行命名)

如何使用呢？還是用個例子來說明吧

<!doctype html>
<html>
<head>
<metacharset="utf-8">
<title>魚橙的結合</title>
</head>
<body>
<divid="content"> <a id="top_1"></a>
  <h1> i am a <ahref="http://www.google.com.tw">魚橙的結合1</a></h1>
  <p> Back in April, we introduced Google Affiliate Ads for Blogger, a gadget that can help you earn money by adding an ad for a relevant product to a blog post and earning a commission when someone clicks on your ad and makes a purchase. We’ve received positive feedback from Blogger users and the advertisers who have made their products available through the gadget, and wanted to let you know about could reach users early and let people try new things. We also introduced the Blogger In Draft blog, and for the past five years, we’ve introduced new updates and options here, often before we told the rest of the world on our official blog, Buzz. With the recent launch of our Google+ page, we have another...er....</p>
  <p><a href="#top_1">go to top</a></p>
  <a id="top_2"></a>
  <h1> i am a <ahref="http://www.google.com.tw">魚橙的結合2</a></h1>
  <p> told the rest of tWe’ve received positive feedback from Blogger users and the advertisers who have made their products available through the gadget, and wanted to let you know about could reach users early and let people try new things. We also introduced the Blogger In Draft he world on our official blog, Buzz. With the recent launch of our Google+ page, we have another....</p>
  <p>Back in Aprind earning a commission when someone clicks on your ad and makes a purchase. </p>
  <p>We also introduced tst five years, we’ve introduced new updates and options here</p>
  <p><a href="#top_2">go to top</a></p>
</div>
</body>
</html>

我在每個標題<h1>前面都加入一個錨點，分別為top_1及top_2，我要求的目的鶗當讀者看文單個文章的時候，可點go to top ，回到該標題的位置，而無須用滾軸去找尋該篇文章的位置，故在每篇文章後面分別加上<a href="#top_1">及<a href="#top_2">，此時go to top 會變成連結選項，當你點選該位置時，電腦就依尋你點的位置，去移動。

而為何他會如此動作，因為在標題前面新增了一個id 連結名字為top_1，當你在下面設連結時，如果要點回top_1位置，只要告訴電腦說，連結回一個#top_1的名字的地方，就可以了。

該例因版面問題，各位可以將<p></p>多新增幾段，讓文字變多，行數變多，達到要滾軸的地步，這樣效果較好！

贊助：銑刀