Канал WebForMySelf - IT и веб-разработка
4.26K subscribers
289 photos
5 videos
81 files
3.06K links
Канал сайта WebForMySelf. Самые свежие материалы из мира IT и веб-разработки
Связь: https://webformyself.support-desk.ru/
Download Telegram
В этом уроке мы приступим к изучению ключевой возможности любого CSS фреймворка вообще и фреймворка Bootstrap 4 в частности – речь идет о сетке. Именно сетка Bootstrap позволяет нам создавать ровные и аккуратные макеты, которые уже изначально являются адаптивными и отлично смотрятся на любом устройстве, будь то десктоп, планшет или смартфон. В этом уроке мы рассмотрим теорию сеток CSS фреймворков.
#bootstrap #премиум
https://webformyself.com/urok-3-frejmvork-bootstrap-4-setka-bootstrap-4-chast-1/
В этом уроке мы продолжим изучение сетки Bootstrap 4 и работу с этим замечательным инструментом. В уроке мы рассмотрим опции сетки, понятие контрольных точек (breakpoints), а также рассмотрим ключевые классы сетки. Практически все они работают как в четвертой, так и в третьей версии фреймворка, поэтому урок будет полезен, если вы хотите изучить обе версии Bootstrap.
#bootstrap #премиум
https://webformyself.com/urok-4-frejmvork-bootstrap-4-setka-bootstrap-4-chast-2/
В этом уроке мы продолжим изучение сетки Bootstrap и работу с этим замечательным инструментом. В уроке мы познакомимся с новыми классами Bootstrap 4, благодаря которым мы легко можем выравнивать блоки относительно горизонтальной или вертикальной оси. Например, используя лишь два класса, мы сможем быстро решить задачу центрирования элемента как по горизонтали, так и по вертикали.
#bootstrap #премиум
https://webformyself.com/urok-6-frejmvork-bootstrap-4-setka-bootstrap-chast-4-vyravnivanie/
В этом уроке мы продолжим изучение сетки Bootstrap и работу с этим замечательным инструментом. В уроке мы познакомимся с набором классов, которые позволяют скрывать или показывать элементы в зависимости от используемого брейкпойнта. Это очень полезная возможность, которую предлагает нам набор классов responsive utilities.
#bootstrap #премиум
https://webformyself.com/urok-8-frejmvork-bootstrap-4-setka-bootstrap-chast-6-responsive-utilities/
В этом уроке мы познакомимся с примерами использования компонента медиа объект (media object) в Bootstrap. Данный компонент представляет из себя небольшое изображение в левой части строки и некоторый текст в правой части. Соответственно, медиа объект хорошо подойдет для реализации таких вещей, как комментарии, например.
#bootstrap #премиум
https://webformyself.com/urok-9-frejmvork-bootstrap-4-media-obekt-bootstrap/
В этом уроке мы узнаем, как реализовать адаптивность изображений и видео в Bootstrap 4. Благодаря всего нескольким классам мы с легкостью получим адаптивные изображения и видео в Bootstrap.
#bootstrap #премиум
https://webformyself.com/urok-10-frejmvork-bootstrap-4-adaptivnye-izobrazheniya-i-video-v-bootstrap/
В этом уроке мы поработаем с таблицами в Bootstrap. По умолчанию таблицы без классов не оформлены и выглядят не очень презентабельно. Однако, стоит добавить таблице всего-навсего один класс table, как таблица преобразится и будет выглядеть достаточно интересно. Также Bootstrap предлагает ряд дополнительных классов, позволяющих оформлять и украшать таблицы. Кроме того, мы рассмотрим новый класс Bootstrap 4, который позволят реализовать симпатичную темную таблицу.
#bootstrap #премиум
https://webformyself.com/urok-11-frejmvork-bootstrap-4-tablicy-v-bootstrap/
Одним из часто используемых на сайте элементов являются кнопки. В Bootstrap 4 кнопки фактически остались теми же, что и в предыдущей версии, но появились и новые возможности. Получить симпатичную кнопку в Bootstrap очень просто – достаточно использовать ключевой класс btn и дополнительный класс для цветового оформления кнопки. При этом добавлять эти классы мы можем не только кнопкам, но и, к примеру, ссылкам. В результате ссылка ничем не будет отличаться от кнопки.
#bootstrap #премиум
https://webformyself.com/urok-12-frejmvork-bootstrap-4-knopki-v-bootstrap/
Данный урок мы посвятим работе с компонентом модального окна в Bootstrap. Благодаря модальным окнам мы можем компактно разместить любые данные нашего сайта, спрятав их изначально и показывая в модальном окне при клике или же по какому-то событию. В уроке мы рассмотрим варианты вызова модального окна при клике и программно.
#bootstrap #премиум
https://webformyself.com/urok-14-modalnye-okna-bootstrap/
До того, как я открыл для себя CSS Grid, я часто использовал сетку Bootstrap. Сетка Bootstrap была разумным решением для многих проблем с адаптивностью, которые у меня в то время возникали. Затем я обнаружил CSS Grid. Преимущество CSS Grid над Bootstrap — это ее двумерная природа (возможность использовать строки и столбцы), а не одна строка в Bootstrap.
#bootstrap #cssgrid
https://webformyself.com/obedinenie-css-grid-s-setkoj-bootstrap/