Иконки очень важны для современных веб-страниц. Если вы создаете собственное веб-приложение, то, скорее всего, вам нужно будет использовать значки для
- Навигация
- Повышение читабельности
- Выделите новые интересные функции
- Выразите свое творчество
- и более
Я покажу, как добавлять значки на ваши веб-страницы с помощью Font Awesome. Font Awesome - это значки, которые вы можете реализовать в формате SVG. Вот отличный сайт, чтобы узнать, что такое SVG и их преимущества.
- Сначала перейдите на https://fontawesome.com/ и нажмите Начать бесплатно.
2. Вам нужно будет ввести свой адрес электронной почты, поскольку они пришлют вам «комплект», который будет содержать ваш тег ‹script›, который вы будете вводить в свой HTML-файл.
3. Это тег скрипта, который вы скопируете и вставите в свой тег ‹head› в вашем HTML-файле, как показано ниже.
4. Давайте перейдем к нашему HTML-файлу и вставим его в наш тег ‹head›.
5. Давайте добавим популярный значок нашего гамбургер-меню на нашу панель навигации. Давайте поищем значок нашего меню. Код, который мы возьмем, - это
- ‹i class« fas fa-bars »› ‹/i›
6. Вернемся к нашему HTML-файлу и добавим значок.
7. Это наш окончательный результат. Мы можем стилизовать иконку с помощью предоставленного класса fas fa-bars. Одним из преимуществ использования SVG является то, что мы можем изменить цвет.
8. Я опубликую видео шаг за шагом, начиная с шага 1. Я также покажу, как динамически изменять строку меню, чтобы скрыть и показать элементы навигации.
Спасибо за прочтение!
