Use Dreamweaver to make personalized small icons for your website

Don't underestimate a small icon, it can fully display the personality of the Web page, this example will explain how to put a small icon on your personal home page.

Effect description

Appearing on the address bar is not the Microsoft Web page file icon, but becomes its own small icon, as shown in Figure 33-1. If you add the page to your Favorites folder, a small icon of personality will appear in your favorites, as shown in Figure 33-2.

Creative Thinking

Create a small icon in your site by placing an icon file or adding code directly to the Web page.

Operation Steps

(1) If you want to the entire site on all pages of the address bar on the display of their own personality small icons, just want to name the icon file Favicon.ico, and then put the icon file in the Web site server root directory on the site can be.

Note: When using this method, be sure to name the icon file Favicon.ico and place it under the site root directory.

(2) Enter the link code. If the reader only wants to place a personality icon on one page or place a different icon on a different page, then you need to enter the link code in the page (the Html header tag), as shown in Figure 33-3.

(Readers can open and copy this code directly via "CD" | "source" | "Instance 33" | "33.1.txt")

Note: The URL of the link icon in your code must be an absolute path. The filename of the icon file does not have to be favicon.ico, it can be named at your own discretion. "Shortcut Icon" represents the address bar icon, and "Bookmark" represents the Favorites icon.

The code in the figure is described below.

<link rel= "Shortcut ICON" href= "Http://127.0.0.1/favicon.ico" >

<link rel= "BOOKMARK" href= "Http://127.0.0.1/favicon.ico" >

(3) Save the Web page file, and then put the file on the Web server, browsing the Web page can see the effect, this example operation completed. This example provides two different ways to implement the icon for the address bar, and the reader can choose as needed, using the code method to notice that the URL after "href=" is changed according to the location of the icon.