Cách thêm Favicon vào trang web của bạn với HTML

Một phần của loạt bài: Cách xây dựng một trang web với HTML Dòng hướng dẫn này sẽ hướng dẫn bạn thông qua việc tạo và tùy chỉnh thêm trang web này bằng HTML, ngôn ngữ đánh dấu tiêu chuẩn được sử dụng để hiển thị các tài liệu trong trình duyệt web. Không có kinh nghiệm mã hóa trước là cần thiết nhưng chúng tôi khuyên bạn nên bắt đầu ở đầu loạt phim nếu bạn muốn tạo lại trang web trình diễn.

Vào cuối loạt bài này, bạn sẽ sẵn sàng một trang web để triển khai lên đám mây và sự quen thuộc cơ bản với HTML. Biết cách viết HTML sẽ cung cấp một nền tảng mạnh mẽ để học các kỹ năng phát triển web phía trước bổ sung, chẳng hạn như CSS và JavaScript.

Trong hướng dẫn này, chúng tôi sẽ đi bộ qua các bước liên quan đến việc thêm một favicon vào trang web của bạn bằng HTML. Bạn có thể sử dụng bất kỳ hình ảnh nào bạn thích cho Favicon của mình, nhưng hãy nhớ rằng hình ảnh đơn giản, tương phản cao thường hoạt động tốt nhất với kích thước nhỏ của Favicon. Bạn cũng có thể tạo một favicon tùy chỉnh thông qua các trang web như favicon.cc.

Favicon là một hình ảnh nhỏ nằm trong tab trình duyệt ở bên trái tiêu đề của trang web. Hình ảnh dưới đây minh họa vị trí của một favicon.

Favicon là một hình ảnh nhỏ nằm trong tab trình duyệt ở bên trái tiêu đề của trang web. Hình ảnh dưới đây minh họa vị trí của một favicon.

Để thêm favicon vào trang web của bạn, hãy tạo một thư mục trong thư mục dự án của bạn có tên Hình ảnh [nếu bạn chưa có] và lưu hình ảnh favicon mong muốn của bạn trong thư mục này. Nếu bạn không có hình ảnh, bạn tải xuống hình ảnh cá mập Sammy này mà chúng tôi đã lưu trữ trên trang web trình diễn của chúng tôi. [Đối với việc bồi dưỡng về cách thêm hình ảnh vào trang web bằng HTML, vui lòng truy cập hình ảnh HTML hướng dẫn của chúng tôi từ trước trong loạt bài hướng dẫn này. images [if you dont already have one] and save your desired favicon image in this folder. If you dont have an image, you download this Sammy the Shark image that we have hosted on our demonstration website. [For a refresher on how to add images to webpages using HTML, please visit our tutorial HTML Images from earlier in this tutorial series.

Tiếp theo, thêm phần tử [được tô sáng bên dưới] vào index.html < / a> Tệp ngay bên dưới Yếu tố. Mã của bạn sẽ như thế này: element [highlighted below] to your index.html file right below the element. Your code should now be like this:

... favicon_image_location Với đường dẫn tệp tương đối của hình ảnh Favicon của bạn. Lưu favicon_image_location Với đường dẫn tệp tương đối của hình ảnh Favicon của bạn. Lưu ...

Đảm bảo thay thế favicon_image_location Với đường dẫn tệp tương đối của hình ảnh Favicon của bạn.Lưu index.html tệp và tải lại trong trình duyệt web của bạn.Tab trình duyệt của bạn bây giờ sẽ chứa một hình ảnh favicon.

Bây giờ bạn nên biết cách thêm hình ảnh favicon vào các trang web bằng HTML.

Video liên quan

Chủ Đề