Теги: CSS

Bootstrap 4. Контейнер и сетка. Часть 3

По умолчанию адаптивные блоки визуально отображаются в том порядке, в котором они расположены в HTML коде. Изменить визуальный порядок следования адаптивного блока выполняется посредством класса order-{1…12}. Этот класс предназначен xs устройств. Для изменения порядка для sm, md, lg и xl используется…
Категория: Web-разработкаHTML и CSS

Bootstrap 4. Контейнер и сетка. Часть 2

Адаптивная сетка Bootstrap 4 построена на основе Flexbox. Основой сетки является класс row в качестве родительского контейнера для нескольких адаптивных блоков. Для класса row задано свойство display:flex, а дочерние элементы делят его пространство на части, но для разных разрешений экрана — по разному.
Категория: Web-разработкаHTML и CSS

Bootstrap 4. Контейнер и сетка. Часть 1

Bootstrap 4 — это открытый и бесплатный HTML, CSS и JS фреймворк, который используется веб-разработчиками для быстрого создания адаптивных дизайнов сайтов. В сущности — это просто набор сss- и js-файлов. После подключения этих файлов к странице станут доступны большое количество готовых классов и компонентов.
Категория: Web-разработкаHTML и CSS

WordPress. Создание одностраничного сайта

Будем считать, что WordPress уже установлен и у нас есть сверстанный шаблон страницы, т.е. файл index.html и три папки — img, js и css. Так что перейдем сразу к созданию темы. Для этого создаем директрию wp-content/themes/arcade-theme и внутри директории два файла — style.css и index.php.
Категория: Web-разработкаCMS WoprdPress
Теги: CMSCSSHookHTMLJavaScriptPHPWeb-разработкаWordPressФункция

Yii2. Подключение css и js файлов

Ресурс в Yii — это файл, который нужен для формирования страницы сайта. Это может быть CSS-файл, JavaScript-файл, файл шрифта, файл изображения или видео и так далее. Ресурсы располагаются в доступных по протололу HTTP директориях и обслуживаются непосредственно сервером Apache или Nginx.
Категория: Web-разработкаYii2 и Laravel

Yii2. Создаем свое представление

Вид (View) — это часть MVC архитектуры, которая отвечает за представление данных конечным пользователям. Виды представляют собой PHP-файлы, содержащие HTML и PHP код, отвечающие внешний вид страниц сайта. В Yii2 существуют два вида шаблонов — layout (директория views/layouts) и view (директории views/site, views/page, …).
Категория: Web-разработкаYii2 и Laravel

Анимация элементов страницы

Animate.css — библиотека CSS3-эффектов анимации, созданная на самом же CSS3. На официальном сайте можно посмотреть все возможные для этой библиотеки эффекты и подобрать подходящий в выпадающем списке. Использовать библиотеку очень легко — достаточно скачать и подключить файл animate.css и добавить классы animated…
Категория: Web-разработкаHTML и CSS
Теги: CSSHTMLJavaScriptВерстка

CSS. Flexbox верстка

Модель flexbox-разметки связана с определенным значением CSS-свойства display родительского элемента (flex-контейнер), содержащего внутри себя дочерние блоки (flex-элементы). После установки значения flex каждый дочерний элемент автоматически становится flex-элементом, выстраиваясь в ряд (вдоль главной оси) колонками одинаковой высоты.
Категория: Web-разработкаHTML и CSS

CSS. Единицы измерения vh, vw

В CSS3 были добавлены новые относительные единицы измерения vh и vw, которые вычисляются относительно размеров окна браузера. Для настольных компьютеров ширина окна браузера больше ширины области просмотра (добавляется ширина скроллбара), поэтому если для элемента установить ширину 100vw, то он выйдет за пределы html.
Категория: Web-разработкаHTML и CSS

CSS-переменные

Обычная практика при разработке сайта — составить набор фирменных цветов, которые будут использоваться, чтобы поддержать единый стиль. Увы, многократное использование этих цветов в CSS не только является рутинной работой, но ещё и создаёт пространство для возникновения ошибок.
Категория: Web-разработкаHTML и CSS
Каталог оборудования
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Производители
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Функциональные группы
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.