眾所周知,a標簽是用來定義超鏈接,我們最常用的就是a標簽href屬性,如果沒有設(shè)置這個屬性,他就會和最普通的行內(nèi)元素一樣 span 一樣,a標簽的這些作用還有你不知道的嗎?
1.錨鏈接
在本頁面中可以直接使用#id名來使頁面滾動到id所處位置,需要從其他頁面跳轉(zhuǎn)時,需要在href后加上#id名即可在跳轉(zhuǎn)頁面是滾動到id位置,這個滾動是沒有動畫的,如果需要動畫效果可以加上以下的代碼:
$('.xxHead a').click(function () { $(this).addClass("on").siblings().removeClass("on") $("html, body").animate({ scrollTop: $($(this).attr("href")).offset().top + "px" }, 1000); return false; })
2.打電話發(fā)郵箱
蘋果手機瀏覽器會自動識別網(wǎng)頁中手機號碼,并將其標記為黑色,造成頁面的不美觀。
只需要在頭部加上:
<meta name="format-detection" content="telephone=no" />
但是加上這個會使號碼失去撥號的功能,于是我們可以使用以下代碼為瀏覽器添加撥號功能
<a href="tel:+13245678910">聯(lián)系電話:12345678</a> 打電話:tel標簽
另外 a標簽還能用來發(fā)郵箱
<a href="mailto:123456789@qq.com">Send email</a> 發(fā)郵箱: mailto鏈接
3.下載
部分網(wǎng)頁中需要下載,我們只需要設(shè)置download屬性規(guī)定內(nèi)容就是下的內(nèi)容的屬性名
<a href="文件地址" download="文件名">點擊下載</a>
4.規(guī)定跳轉(zhuǎn)方式
這屬于基操 target屬性_blank規(guī)定新窗口打開,_self規(guī)定本窗口打開
<a href="index.html" target="_self">此窗口打開</a>
5.阻止搜索引擎跟隨
如果A網(wǎng)頁上有一個鏈接指向B網(wǎng)頁,但A網(wǎng)頁給這個鏈接加上了 rel=”nofollow” 標注,則搜索引擎不把A網(wǎng)頁計算入B網(wǎng)頁的反向鏈接。