How To Add Icon Logo In Title Bar Using HTML ? - GeeksforGeeks

Trang chủ » Html Icon In Head Title » How To Add Icon Logo In Title Bar Using HTML ? - GeeksforGeeks

Có thể bạn quan tâm

Adding an icon logo in the title bar of a webpage using HTML involves setting a favicon. A favicon is a small icon displayed in the browser tab next to the page title. This is done by including a <link> tag in the HTML <head> section with the rel=”icon” attribute pointing to the icon file.

Preview Image:

icon logo in title bar using HTML

How to Add a Favicon in HTML

To add a favicon, use the following syntax in the <head> section of your HTML document:

Syntax:

<link rel="icon" href="icon_path" type="image/icon type">

Example: This example demonstrates how to add a favicon to your webpage by including the appropriate syntax in the <head> tag of your HTML document.

html <!-- HTML code to add icon in the title bar --> <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>GeeksforGeeks icon</title> <!-- add icon link --> <link rel="icon" href= "https://media.geeksforgeeks.org/wp-content/cdn-uploads/gfg_200X200.png" type="image/x-icon" /> </head> <body> <h1 style="color: green"> GeeksforGeeks </h1> <p> GeeksforGeeks icon added in the title bar </p> </body> </html>

Output:

adding icon logo in title bar using HTML

Adding a favicon to your webpage is a straightforward process that significantly enhances user experience and website recognition. By including a simple <link> tag in the <head> section of your HTML document, you can ensure that your favicon appears in the browser tab, making it easier for users to identify your site among multiple open tabs.

Comment More info Next Article Retrieve the position (X,Y) of an element using HTML

N

NAYONIKA Follow Improve

Từ khóa » Html Icon In Head Title