background top icon
background center wave icon
background filled rhombus icon
background two lines icon
background stroke rhombus icon

ダウンロード "Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"

input logo icon
目次
|

目次

0:00
Задорное вступление
2:54
А вот и наш макет! Знакомство с макетом
5:54
Файлы проекта
9:21
Плагины проекта
11:42
С чего начинается верстка? Цена работы
17:11
Анализ макета. Плагин для Figma Font Fascia
21:15
Поиск и подключение шрифтов. Плагин для Visual Studio Google Fonts
29:03
Построение сетки. Ограничивающий контейнер
36:48
Применение селектора-атрибута
39:43
Анализ блока шапки
44:00
Разметка макета и начало верстки шапки
52:34
Верстка логотипа, меню, кнопки "Download"
1:11:52
Настройка адаптивности для шапки
1:23:52
Верстка бургера
1:30:30
Настройка адаптивности для логотипа
1:37:14
Открытие-закрытие меню средствами CSS3
1:38:30
Применение псевдокласса Target, доработка бургера
1:51:00
Верстка блока Main
2:10:54
Использование конструкции :not(:last-child)
2:15:28
Работа с декором блока Main
2:26:46
Верстка блока Stay-safe
2:32:37
Магия БЭМ в действии. Повторное использование кода
2:42:10
Работа с декором блока Stay-safe
2:47:00
Настройка адаптивности для блока Stay-safe
2:53:58
Верстка блока Expert
3:01:06
Альтернативный прием размещения декора в блоке
3:10:38
Верста нижней части блока Expert
3:11:20
И снова БЭМ в работе. Копирование текстового блока
3:14:45
Вставка видео. Тег Iframe. Адаптивное видео
3:18:45
Настройка адаптивности для блока Expert
3:24:16
Верстка блока Healthcare
3:40:32
Верстка декора с использованием псевдоэлементов :after и :before
3:48:00
Верстка футера
3:50:20
Текст в карточках футера
3:51:00
Настройка адаптивности для блока Footer
カタログの類似ビデオ
|

カタログの類似ビデオ

Адаптивная верстка сайта интернет-магазина. Объяснение действий. HTML SCSS JS FIGMA GULP WEBPACK.
6:36:28

Адаптивная верстка сайта интернет-магазина. Объяснение действий. HTML SCSS JS FIGMA GULP WEBPACK.

チャネル: Фрілансер по життю
Верстка сайта с нуля! 7 000 за 2 дня! Повторяй! Верстай! Зарабатывай! #3
4:45:21

Верстка сайта с нуля! 7 000 за 2 дня! Повторяй! Верстай! Зарабатывай! #3

チャネル: Обучение HTML, CSS, JavaScript | Анатолий Ивашов
Марафон по верстке. Часть №1. Адаптивная верстка макета с нуля GULP SCSS JS
2:17:10

Марафон по верстке. Часть №1. Адаптивная верстка макета с нуля GULP SCSS JS

チャネル: Фрілансер по життю
Адаптивна верстка для початківців. Пояснення дій. HTML CSS FIGMA
3:10:38

Адаптивна верстка для початківців. Пояснення дій. HTML CSS FIGMA

チャネル: Фрілансер по життю
Адаптивная верстка сайта с нуля! Верстка сайта, стоимостью 7000
4:55:47

Адаптивная верстка сайта с нуля! Верстка сайта, стоимостью 7000

チャネル: Обучение HTML, CSS, JavaScript | Анатолий Ивашов
Адаптивная верстка сайта интернет-магазина. Объяснение действий. HTML SCSS JS FIGMA GULP WEBPACK.
8:15:37

Адаптивная верстка сайта интернет-магазина. Объяснение действий. HTML SCSS JS FIGMA GULP WEBPACK.

チャネル: Фрілансер по життю
Адаптивна верстка сайту для початківців. Пояснення дій. HTML CSS FIGMA. Частина №2
3:15:27

Адаптивна верстка сайту для початківців. Пояснення дій. HTML CSS FIGMA. Частина №2

チャネル: Фрілансер по життю
Адаптивна верстка сайту на базі шаблону ЧФ3. Пояснення дій. HTML CSS JS FIGMA. Частина №2
4:00:11

Адаптивна верстка сайту на базі шаблону ЧФ3. Пояснення дій. HTML CSS JS FIGMA. Частина №2

チャネル: Фрілансер по життю
ビデオのタグ
|

ビデオのタグ

фрилансер по жизни
адаптивная верстка сайта
адаптивная верстка сайта html css
адаптивная верстка сайта flexbox
адаптивная верстка шапки сайта
верстка макета
верстка макета figma
верстка макета html css
верстка макета с нуля
верстка макета для новичков
верстка макета из фигмы
адаптивная верстка
верстка практика
верстка сайта
верстка сайтов уроки
адаптивная верстка макета
верстка сайтов
обучение верстке
html css
javascript
UDL Helperインストールされています ビデオをワンクリックでダウンロード

説明:

Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. В этом видео я покажу подробную HTML CSS верстку простого макета FIGMA с кучей полезных решений и лайвхаков! Полезные ссылки: 👉 Макет (открытый доступ): https://www.patreon.com/posts/61368263 👉 Результат верстки: https://www.patreon.com/posts/rezultat-verstki-61798286 👉 Бесплатный курс по верстке: https://www.youtube.com/playlist?list=PLM6XATa8CAG4F9nAIYNS5oAiPotxwLFIr 👉 VS Code: https://www.youtube.com/watch?v=nxCLXMBl4e4 👉 Как правильно учиться: https://www.youtube.com/watch?v=eKZNKA-jAYY 👉 План развития фронтенд разработчика (+КАРТА): https://www.youtube.com/watch?v=yJcCKuxfb2o 🔴 Карта канала: https://miro.com/app/board/o9J_lZB3YKI=/ 🔴 Получить доступ к плюшкам + поддержать канал: https://www.patreon.com/freelancerlifestyle 🔴 Instagram: https://www.facebook.com/unsupportedbrowser 🔴 Telegram канал: https://t.me/freelancer_lifestyle (https://teleg.run/freelancer_lifestyle) 🔴 Telegram чат по верстке: https://t.me/flschat (https://teleg.run/flschat) 🔴 Facebook: https://www.facebook.com/unsupportedbrowser За тайм коды спасибо Сергей Кудаев! 00:00:00 - Задорное вступление 00:02:54 - А вот и наш макет! Знакомство с макетом 00:05:54 - Файлы проекта 00:09:21 - Плагины проекта 00:11:42 - С чего начинается верстка? Цена работы 00:17:11 - Анализ макета. Плагин для Figma Font Fascia 00:21:15 - Поиск и подключение шрифтов. Плагин для Visual Studio Google Fonts 00:29:03 - Построение сетки. Ограничивающий контейнер 00:36:48 - Применение селектора-атрибута 00:39:43 - Анализ блока шапки 00:44:00 - Разметка макета и начало верстки шапки 00:52:34 - Верстка логотипа, меню, кнопки "Download" 01:11:52 - Настройка адаптивности для шапки 01:23:52 - Верстка бургера 01:30:30 - Настройка адаптивности для логотипа 01:37:14 - Открытие-закрытие меню средствами CSS3 01:38:30 - Применение псевдокласса Target, доработка бургера 01:51:00 - Верстка блока Main 02:10:54 - Использование конструкции :not(:last-child) 02:15:28 - Работа с декором блока Main 02:26:46 - Верстка блока Stay-safe 02:32:37 - Магия БЭМ в действии. Повторное использование кода 02:42:10 - Работа с декором блока Stay-safe 02:47:00 - Настройка адаптивности для блока Stay-safe 02:53:58 - Верстка блока Expert 03:01:06 - Альтернативный прием размещения декора в блоке 03:10:38 - Верста нижней части блока Expert 03:11:20 - И снова БЭМ в работе. Копирование текстового блока 03:14:45 - Вставка видео. Тег Iframe. Адаптивное видео 03:18:45 - Настройка адаптивности для блока Expert 03:24:16 - Верстка блока Healthcare 03:40:32 - Верстка декора с использованием псевдоэлементов :after и :before 03:48:00 - Верстка футера 03:50:20 - Текст в карточках футера 03:51:00 - Настройка адаптивности для блока Footer 👋 Меня зовут Женя Андриканич, я IT - специалист, занимаюсь разработкой сайтов. На этом канале, я регулярно и в максимально доступном формате буду делиться с тобой своим опытом, наработками, секретами и лайфхаками! Ссылка на канал: https://www.youtube.com/c/freelancerlifestyle 🤟 Живи, а работай в свободное время! ©

ダウンロードオプション準備中

popular icon
人気
hd icon
HDビデオ
audio icon
音声のみ
total icon
全フォーマット
* - ビデオが新しいタブで再生されている場合は、そのタブに行き、ビデオを右クリックして「ビデオを名前を付けて保存」を選択します
** - 専用プレーヤーでのオンライン再生用のリンク

ビデオダウンロードに関するご質問

mobile menu icon"Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"ビデオをダウンロードする方法は?mobile menu icon

  • http://unidownloader.com/サイトは、プログラムやブラウザー拡張機能をインストールせずにビデオや個別のオーディオトラックをダウンロードする最高の方法です。 UDL Helper拡張機能は、コンテンツをすばやくダウンロードできるように、YouTube、Instagram、OK.ruのサイトに調和して統合される便利なボタンです。 UDL Client(Windows用)プログラムは、900以上のサイト、ソーシャルネットワークやビデオホスティング、及びソースで利用可能なあらゆるビデオ画質をサポートする最も強力なソリューションです。 UDL Liteは、モバイルデバイスを使用してサイトに簡単にアクセスできる方法です。これを使用することにより、ビデオがお使いのスマホに直接ダウンロードできます。

mobile menu iconどの"Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"ビデオフォーマットを選択したらよいか?mobile menu icon

  • 最高画質のフォーマットは、FullHD(1080p)、2K(1440p)、4K(2160p)と8K(4320p)です。画面の解像度が高いほど、ビデオ画質も高くなります。ただし、ダウンロード速度、空き容量、再生中のデバイスのパフォーマンスなど、他の要素も考慮する必要があります。

mobile menu icon"Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"ビデオのダウンロード中にパソコンがフリーズするのはなぜか?mobile menu icon

  • ブラウザやコンピュータが完全にフリーズしてしまうのは普通のものではありません!完全にフリーズした場合は、ビデオへのリンクを添えてご報告ください。ビデオを適切なフォーマットで直接ダウンロードできない場合があるため、ファイルを必要なフォーマットに変換する機能を追加しました。場合によっては、このプロセスはパソコンのリソースを積極的に利用できます。

mobile menu icon"Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"ビデオをスマホにダウンロードする方法は?mobile menu icon

  • ビデオをお使いのスマホにサイト若しくはUDL Liteのpwaアプリを使用してダウンロードできます。UDL Helper拡張機能を使用して、QRコード経由でダウンロードリンクを送信することもできます。

mobile menu iconオーディオトラック(音楽)をMP3 "Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"でダウンロードする方法は?mobile menu icon

  • 最も便利な方法は、ビデオをMP3フォーマットへ変換することをサポートするUDL Clientプログラムを使用することです。場合によっては、MP3がUDL Helperも使用してダウンロードできます。

mobile menu icon"Адаптивная верстка сайта с нуля для начинающих. Объяснение действий. HTML CSS"ビデオからスクリーンショットを撮る方法は?mobile menu icon

  • この機能は、UDL Helper拡張機能で利用できます。設定で「ビデオスクイーンショットボタンを表示する」オプションがチェックされているを確認してください。「設定」アイコンの左側にあるプレーヤーの右下隅には、クリックするとビデオの現在のフレームがお使いのパソコンにJPEGフォーマットで保存されるカメラアイコンが表示されます。

mobile menu icon全部でいくらかかるか?mobile menu icon

  • 無料です。私たちのサービスはすべてのユーザーにとって完全に無料です。PROサブスクリプションもなく、ダウンロードビデオの数や最大長に制限もありません。