在網(wǎng)頁地址欄中添加特定圖標(biāo)的方法

發(fā)布時(shí)間：2020-08-31 11:00:59 來源：億速云閱讀：263 作者：小新欄目：web開發(fā)

這篇文章將為大家詳細(xì)講解有關(guān)在網(wǎng)頁地址欄中添加特定圖標(biāo)的方法，小編覺得挺實(shí)用的，因此分享給大家做個(gè)參考，希望大家閱讀完這篇文章后可以有所收獲。

首先我們要知道這個(gè)特定圖標(biāo)是什么？有什么作用？

它是一個(gè)favicon文件，當(dāng)我們?cè)诰W(wǎng)站上使用favicon，會(huì)比在瀏覽器上看到空白文檔圖標(biāo)要好得多，此外，這樣會(huì)使得網(wǎng)站看起來更加專業(yè)一點(diǎn)。

下面我們就來介紹一下向網(wǎng)站添加favicon圖標(biāo)的簡(jiǎn)單方法。

方法一：讓瀏覽器自動(dòng)獲取您的圖標(biāo)（無需更改網(wǎng)站代碼）

大多數(shù)瀏覽器會(huì)自動(dòng)檢測(cè)位于您網(wǎng)站目錄中的favicon.ico文件，并將其設(shè)置為您網(wǎng)站的圖標(biāo)。這是向網(wǎng)站添加favicon的最簡(jiǎn)單方法。

我們來看看實(shí)現(xiàn)步驟：

1、必須擁有任何圖像格式（jpg，bmp，gif，png）的方形圖像，才能在瀏覽器中正常顯示。當(dāng)然，非方形圖像也可以工作，但是，這些圖標(biāo)可能看起來不專業(yè)。

2、需要將圖像轉(zhuǎn)換為.ico格式。網(wǎng)上有很多工具可以做到這一點(diǎn)，本文內(nèi)，我們使用在線轉(zhuǎn)換，網(wǎng)址：convertico.com。

3、打開convertico.com后，你將看到一個(gè)用于選擇和上傳圖像文件的按鈕。

在網(wǎng)頁地址欄中添加特定圖標(biāo)的方法

4、單擊按鈕并選擇您喜歡的圖像，在您繼續(xù)操作后，圖像將自動(dòng)轉(zhuǎn)換并顯示在網(wǎng)站的右側(cè)以供下載：

在網(wǎng)頁地址欄中添加特定圖標(biāo)的方法

5、單擊“ 下載”箭頭按鈕下載圖像，并將.ico文件保存在計(jì)算機(jī)的任何位置。

6、現(xiàn)在將文件重命名為favicon.ico，因?yàn)闉g覽器只會(huì)自動(dòng)識(shí)別此名稱。

7、最后一步是將此文件上傳到你網(wǎng)站文件所在的主機(jī)目錄中。上傳文件，可以使用文件管理器或FTP客戶端。

當(dāng)您的favicon.ico文件與其他網(wǎng)站文件一起上傳時(shí)，瀏覽器將自動(dòng)收集它并在瀏覽器中顯示該圖像。方法二：使用常規(guī)圖像并在網(wǎng)站代碼中指定它

如果您認(rèn)為將圖像轉(zhuǎn)換為其他格式太麻煩，您肯定可以使用常規(guī)圖像作為網(wǎng)站的圖標(biāo)。

我們來看看實(shí)現(xiàn)步驟：

1、同樣必須擁有任何圖像格式（jpg，bmp，gif，png）的方形圖像，才能在瀏覽器中正常顯示。當(dāng)然，非方形圖像也可以工作，但是，這些圖標(biāo)可能看起來不專業(yè)。

2、將此文件上傳到您的網(wǎng)站文件所在的主機(jī)目錄。

3、現(xiàn)在，您需要在網(wǎng)站代碼中指定要用作favicon的圖像。<head></head>在網(wǎng)站代碼中的代碼之間添加此行：

<link rel="shortcut icon" type="image/png" href="/favicon.png"/>

說明：

type="image/png"將png零件更改favicon.png為圖像格式并更改為文件名。

HTML代碼現(xiàn)在看起來與此類似：

在網(wǎng)頁地址欄中添加特定圖標(biāo)的方法

注：如果看不到新的圖標(biāo)，請(qǐng)清除瀏覽器的緩存并重新啟動(dòng)它。

關(guān)于在網(wǎng)頁地址欄中添加特定圖標(biāo)的方法就分享到這里了，希望以上內(nèi)容可以對(duì)大家有一定的幫助，可以學(xué)到更多知識(shí)。如果覺得文章不錯(cuò)，可以把它分享出去讓更多的人看到。

向AI問一下細(xì)節(jié)

猜你喜歡