How to set the page icon by html
This article mainly introduces "how to set page icons in html". In daily operation, I believe many people have doubts about how to set page icons in html. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful to answer the doubts about "how to set page icons in html". Next, please follow the editor to study!
In html, you can use the link tag to set the page icon; just add the "" code to the head tag of the page.
The operating environment of this tutorial: windows7 system, HTML5 version, Dell G3 computer.
Prepare materials
1. Prepare a 32px*32px-sized ico icon.
2. Prepare the development environment.
Start production
Setting the ico icon of a web page is actually relatively simple, as long as you add a line of code to the head tag of the page. Does this line of code look simple?
Examples of use are as follows:
System home page
Hello World
Refresh the page in the browser, if you see an effect similar to the following picture, then congratulations! This wave of operations has been successful.
Description:
The link element can be used to introduce resource files outside the HTML page. In the Web development process, developers will use link to introduce CSS files into the page, of course, you can also use link to set the ico icon.
Rel: represents the type of resource to be referenced.
Href: represents the URL that points to the resource.
The rel= "shortcut icon" in the code is a fixed way of writing If this property is defaulted, it will affect the correct display of the ico icon. So be sure to remember to write this property. This line of code commonly tells the browser to help introduce an icon in ico format, and the address of the resource is in the href.
At this point, the study on "how to set up page icons in html" is over. I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!
