Уроки Bootstrap верстки / #8 - Иконочный шрифт и изображения

preview_player
Показать описание

В этом уроке мы с вами изучим иконочный шрифт, а также рассмотрим несколько классов для красивого оформления картинок.

✔ -------------

- Уроки от #GoshaDudar 👨🏼‍💻
- Все уроки по хештегу #GoshaBootstrap
  1. Гоша Дударь
  2. glyphicon
  3. bootsrap изображения
  4. Иконочный шрифт
  5. Bootstrap
  6. bootstrap уроки
Рекомендации по теме
Уроки Bootstrap верстки 0:10:59

Уроки Bootstrap верстки / #8 - Иконочный шрифт и изображения

Верстка с Bootstrap 0:27:11

Верстка с Bootstrap - Урок 8. Меню Категорий | StudioProWeb

Урок 8. Что 0:35:11

Урок 8. Что такое Bootstrap | Курс Веб разработчик | Академия верстки...

Адаптивная верстка интернет-магазина 0:42:55

Адаптивная верстка интернет-магазина на Bootstrap 5. Урок 8

HTML-верстка на Bootstrap 0:09:18

HTML-верстка на Bootstrap | #8 Кнопка с выпадающим меню

Уроки Bootstrap верстки 0:11:40

Уроки Bootstrap верстки | Что такое в Bootstrap: Buttons и Cards?

Урок 8 Bootstrap 0:02:05

Урок 8 Bootstrap 4 . Jumbotron.

Уроки Bootstrap верстки 0:17:04

Уроки Bootstrap верстки / #7 - Создание форм

Подключение Bootstrap к 0:03:01

Подключение Bootstrap к сайту. Урок №1.

Уроки Bootstrap верстки 0:12:07

Уроки Bootstrap верстки | Создание форм

Уроки Bootstrap верстки 0:07:51

Уроки Bootstrap верстки / #9 - Текстовые панели

Bootstrap. Подключение Bootstrap 0:02:05

Bootstrap. Подключение Bootstrap CDN. Урок 8

Bootstrap верстка современного 0:46:43

Bootstrap верстка современного сайта за 45 минут!

Верстка с Bootstrap 0:23:06

Верстка с Bootstrap - Урок 7. Адаптивный Footer (подвал) сайта | StudioProWeb...

Фреймворк Bootstrap. УРОК 0:06:12

Фреймворк Bootstrap. УРОК №8. Верстка и оформление футера. (Андрей Кудлай - Webformyself)...

Верстка с Bootstrap 0:34:55

Верстка с Bootstrap Урок 4 - Верстка шапки (Header) Часть 2 | StudioProWeb...

Уроки Bootstrap верстки 0:09:25

Уроки Bootstrap верстки / #11 - JS Collapse

Уроки Bootstrap верстки 0:07:36

Уроки Bootstrap верстки / #1 - Основы и установка

Верстка с Bootstrap 0:32:34

Верстка с Bootstrap - Урок 10. Подключение иконок, бургер меню и адаптация | StudioProWeb...

CSS + HTML, 0:23:12

CSS + HTML, урок 8. Bootstrap. Стилизация компонентов Bootstrap. Внедрение собственного css в проект...

Урок 8. Bootstrap 0:09:40

Урок 8. Bootstrap 4. Быстрый старт. Футер сайта

Уроки Bootstrap верстки 0:10:11

Уроки Bootstrap верстки | Что такое Bootstrap? | Обзор Bootstrap

#1 Сетка Bootstrap 0:15:02

#1 Сетка Bootstrap 5 для начинающих | Быстрая верстка сайта при помощи колоночной сетки...

Уроки Bootstrap верстки 0:07:50

Уроки Bootstrap верстки | Что такое Bootstrap Collapse?

Комментарии
Автор

За 8 уроков этот самый лучший и информативный!) Лайк

nelkor
Автор

Салют, Гоша. Тебе надо бы побольше практики. Ну всмысле уже снимать верстку проэктов. А так просто лучший

syrgakomuraliev
Автор

Крутой курс чтобы понять азы верстки на бутстрапе. Но не планируете ли обновление курса на боотстрап 5 ? А то на новой версии много что уже не работает и не актуально. Дальше конечно кому нужно можно и по документации разбираться, но актуальная версия была бы интереснее тем кто с самого начала смотрит...

AlejanD
Автор

Извините, а будут уроки по <less> ?

aleksdonTIME
Автор

Когда bootstrap окончательно перейдет на 4 версию? уже кажется долго они делают.) жду

aa
Автор


Насколько я понимаю это просто принято использовать теги <i> и <span> для подключения символьных иконок.
Так как работает и с тегом <b>, например.

Так же можно сделать ссылку <a class="glyphicon glyphicon-eye-close"></a>

devlog
Автор

Очень хороший туториал, но иконки подключить все таки надо было. Целый час подключал

alexsoft
Автор

У кого не работает на бутстрапе 4 версии вот код версии 3.3.7

<!-- Latest compiled and minified CSS -->

<!-- Optional theme -->

<!-- Latest compiled and minified JavaScript -->

У меня заработало)

antonnikolenko
Автор

Бутстрап 4. img-thumbnail работает, img-rounded, circle не работает. Как подключить?

ThoraxSport
Автор

А там где мы писали 57 ещё какие есть классы кроме badge?

edem
Автор

Здравствуйте, Гоша. У меня почему то ничего не работает из этого урока! Копировала код с сайта Bootstrap, все как у вас, с иконками ни работает ни i ни span, картинка так же не становиться адаптивной, овальной и т.д

Начиная с 1 урока, вставила этот код с Bootstrap


И все прекрасно работало не считая этот урок.

Сейчас зашла снова на Bootstrap скачала заново, тут код другой похоже:

<!-- Latest compiled and minified CSS -->

<!-- Optional theme -->

<!-- Latest compiled and minified JavaScript -->

И с ним у меня все получилось, картинка стала адаптивной и округлой и т.д. А вот иконки по прежнему не появляются и вся менюшка, которую делали на предыдущих уроках поехала к чертям. Что мне делать? Прошу, помогите.

ЕленаМалютина-же
Автор

<path fill-rule="evenodd" d="M0 2a2 2 0 0 1 2-2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H2a2 2 0 0 1-2-2V2zm5.5 10a.5.5 0 0 0 .832.374l4.5-4a.5.5 0 0 0 0-.748l-4.5-4A.5.5 0 0 0 5.5 4v8z"/>
</svg> - это аналог в четвертом бутстрапе? А покороче нельзя?

Mediumwell
Автор


но нужно использовать вот эти CDN:
<!-- Latest compiled and minified CSS -->

<!-- Optional theme -->
<!-- jQuery -->

<!-- Latest compiled and minified JavaScript -->

Ivan-rcit
Автор

все расценки на его сайте - в рублях, а не гривнах. Сам он говорит с акцентом русских с Украины.

shiqqyashkuri
Автор

Сделай пожалуйста уроки по Turbo Pascal. Буду благодарен.

pinkyniger