Категории
- Frontend
  - Angular
  - HTML
  - CSS
  - JavaScript
  - Vue
  - jQuery
  - React
  - AngularJS
  - Backbone
  - TypeScript
  - Ember
  - Next.js
  - Elm
  - Svelte
  - Single SPA
  - Three.js
  - D3.js
  - RxJS
  - WebGL
  - barba.js
- Backend
  - PHP
  - Python
  - Ruby on Rails
  - Yii
  - Laravel
  - SQL
  - Ruby
  - Symfony
  - Java
  - Scala
  - Node.js
  - MongoDB
  - Golang (Google Go)
  - Slim
  - Silex
  - Firebase
  - C Sharp (C#)
  - Deno
  - Redis
  - Django
  - NestJS
  - Spring
  - Spring Boot
  - Spring Data
  - Spring Cloud
  - Spring Security
  - Spring Integration
  - Spring HATEOAS
  - Spring MVC
  - Elixir
  - Phoenix
- System programming
  - Rust
  - WebAssembly
  - C++
- Marketing
  - SEO
- Video and 3D
  - Blender
  - Cinema 4D
  - ZBrush
- Graphic
  - Figma
  - Sketch
  - Photoshop
  - After Effects
  - Illustrator
  - Adobe XD
  - Lightroom
  - CorelDRAW
- DevOps
  - AWS
  - Azure
  - Docker
  - Git
  - GitHub
  - Gitlab
  - Google Cloud
  - Grafana
  - Kubernetes
  - Jenkins
  - Terraform
  - Другое
- Tools
  - GraphQL
  - Flux
  - Webpack
  - Ansible
  - Gulp
  - Grunt
  - Visual Studio Code
  - VIM
  - OpenCV
  - Salt
  - SVN
  - Atom
  - Elasticsearch
  - Сборки, готовые решения
  - Electron
  - Chrome DevTools
  - Yarn
  - Babel
  - Grep
  - npm
  - Vite
  - Gatsby
  - PhpStorm
  - Webflow
  - Hibernate
  - Socket.io
  - Bash
- Разработка мобильных приложений
- Gamedev
  - Unreal Engine
  - Unity
- CMS
  - Wordpress
  - OpenCart
  - Drupal
  - Joomla
  - 1C-Bitrix
  - MODX
  - Magento
  - Shopify
- Blockchain
  - Криптовалюты
  - Decentralized Applications (dApps) (Web 3)
- Тестирование
  - Postman
  - Selenium
  - Appium
  - Protractor
  - WebdriverIO
  - Cypress
  - Playwright
- Другое
- Подготовка к собеседованию
- Обработка и анализ данных
- Информационная безопасность
  - Этический взлом / Тестирование на проникновение
- Английский язык
- Конференции
Источники
Все курсы
- Популярные
- Бесплатные (100+ Курсов)
Разделы
Книги
- Бесплатные
- Популярные
Краудфандинг

Войти

🍁 Осень в деле: SPTMBR25 → –50% на все пакеты ch. 💻

Главная страница Категория css Практические CSS Layouts

Практические CSS Layouts

Name: Практические CSS Layouts
Price: 13 USD
Rating: 4.6 (30 reviews)

Practical CSS Layouts

frontendmasters

Jen Kramer

Продолжительность

8 ч 58 мин

Категория

CSS

Количество уроков

56 Видео

Дата добавления

18 мая 2023 г., 21:35

Язык

Английский

Дата выхода

17 мая 2023 г., 00:00

Дата обновления

15 авг. 2023 г., 09:26

Устали от обычных макетов? Неуверены, как сделать их более интересными? Этот семинар именно для вас! Присоединяйтесь к Джен на два насыщенных дня, в ходе которых вы создадите три различных отзывчивых веб-сайта для вымышленной группы Magenta Lime.

Мы начнем с базового веб-сайта, закрепляя шрифты, размеры, цвета, изображения, и основы дизайна. Затем мы перейдем к средней сложности сайта, повторно использовав множество элементов из базового дизайна, но добавив интерактивность, дополнительный стиль и немного JavaScript. Наконец, мы решим сложную задачу с созданием сайта, добавляя анимацию, интерактивность и еще более сложные макеты.

Создавайте 3 разных веб-сайта с одним и тем же материалом - легкий, средний и сложный.
Преобразуйте базовые макеты в сложные макеты с помощью нескольких CSS-свойств.
Поддерживайте доступность с помощью семантической разметки.
Изучайте некоторые из последних приемов, выходящих за рамки других курсов Джен.

Посмотреть больше

Удален по просьбе правообладателя

Урок 1. 00:08:23

Introduction
Урок 2. 00:13:34

Styleguide Exercise: CSS Basics Setup
Урок 3. 00:06:39

rem vs. em Units
Урок 4. 00:14:14

Style Guide Type Sizes
Урок 5. 00:11:28

Custom Font & Responsive Image
Урок 6. 00:18:42

HTML Markup for a Simple Website
Урок 7. 00:10:35

CSS for a Simple Responsive Layout
Урок 8. 00:07:07

Mobile Tour Styles
Урок 9. 00:09:54

Reviews & Images Styles
Урок 10. 00:05:11

Margin Collapse
Урок 11. 00:02:13

Basic CSS Footer Styles
Урок 12. 00:07:39

CSS for Tablet Layout
Урок 13. 00:08:01

Responsive Images with the Picture Element
Урок 14. 00:16:26

Basic Tablet CSS Layout
Урок 15. 00:10:20

CSS Styles for Desktop Layout
Урок 16. 00:13:10

Tour Page Styles
Урок 17. 00:06:52

Button Styling Practice
Урок 18. 00:08:28

Button Interactive States
Урок 19. 00:04:59

Tour Text Styles
Урок 20. 00:11:17

Tour Layout Practice
Урок 21. 00:04:28

Album & Tracklist Exercise
Урок 22. 00:03:07

Album Solution
Урок 23. 00:07:19

Album Styles
Урок 24. 00:09:39

Tracklist Styles
Урок 25. 00:08:43

Reviews & Images Mobile Styles
Урок 26. 00:12:33

Reviews & Images Tablet Styles
Урок 27. 00:09:04

Reviews & Images Tablet Styles Exercise
Урок 28. 00:10:43

Reviews & Images Desktop Styles
Урок 29. 00:06:06

Audio Player Overview
Урок 30. 00:10:23

Audio Player Markup
Урок 31. 00:14:40

Audio Player Base Styles
Урок 32. 00:08:48

Play & Mute Button Styles
Урок 33. 00:09:37

Range Slider Styles
Урок 34. 00:03:11

Album Cover Styles
Урок 35. 00:08:12

Hamburger Menu Exercise
Урок 36. 00:04:56

Hamburger Menu Logo Exercise
Урок 37. 00:19:23

Hamburger Menu Styles Exercise
Урок 38. 00:15:12

Hamburger Menu Tablet & Mobile Styles
Урок 39. 00:03:24

Medium Design Site Assembly Exercise
Урок 40. 00:19:02

Medium Design Desktop Layout Exercise
Урок 41. 00:04:41

Small Elements Exercise
Урок 42. 00:05:41

Small Elements Solution
Урок 43. 00:06:02

Review Layout Exercise
Урок 44. 00:04:21

Album Boxes Exercise & Solution
Урок 45. 00:18:31

Double Border Corners
Урок 46. 00:06:08

Navigation Exercise & Solution
Урок 47. 00:16:54

Social Icons
Урок 48. 00:11:49

Tracklist CSS
Урок 49. 00:05:20

Tracklist Show & Hide JavaScript
Урок 50. 00:18:08

Tracklist Grid for Tablet & Desktop
Урок 51. 00:13:03

CSS Transitions & Custom Table Scrollbar
Урок 52. 00:09:31

Diamond Images Mobile Layout
Урок 53. 00:13:57

Diamond Images Tablet & Desktop Layout
Урок 54. 00:05:13

Advanced Layout Exercise
Урок 55. 00:10:40

Advanced Desktop Layout
Урок 56. 00:05:15

Wrapping Up

Авторы - frontendmasters, Jen Kramer

frontendmasters

FrontendMasters - Одна из самых лучших площадок для изучения Frontend. Видеокурсы ведут ведущие люди в этой отрасли.

+753

Jen Kramer

Джен Крамер преподает HTML и CSS для всех уровней более 20 лет. Ранее она была лектором в Гарвардском университете, совмещая это с работой фрилансера по веб-дизайну. Джен также является автором более 70 видео-курсов и трех книг. В настоящее время она занимает должность директора по дизайну обучения и технологиям в AnnieCannons - некоммерческой организации, которая обучает, подготавливает и помогает людям, пострадавшим от торговли людьми, начать у

Категории

Комментарии

Blinks

4 окт. 2023 г., 17:55

https://practical.css.education/

Команда внимательно читает ваши комментарии и оперативно на них реагирует. Вы можете спокойно оставлять запросы на обновления или задавать любые вопросы о курсе здесь.

Другие материалы в этой категории

Изображение курса HTML & CSS Bootcamp - 2023 Edition

udemy

16 мар. 2023 г., 21:16

HTML CSS

HTML & CSS Bootcamp - 2023 Edition

The HTML & CSS Bootcamp 2023 Edition

Этот курс научит вас всему, что вам нужно знать о HTML, CSS и веб-дизайне, чтобы создавать свои собственные потрясающие веб-сайты с нуля. Вместо того, чтобы просто наблюдать за мной во время кодирования, вы научитесь структурировать и создавать любые веб-сайты, которые только сможете представить.Моя специализация - преподавание программ буткемп в режиме очной учебы по всему миру, где я работаю непосредственно с учениками, чтобы помочь им научитьс

37 ч 18 мин

Английский

Посмотреть

+57

Изображение курса Чистая и масштабируемая архитектура CSS

udemy

22 февр. 2023 г., 00:32

CSS

Чистая и масштабируемая архитектура CSS

Clean and Scalable CSS Architecture

Есть много продвинутых курсов по CSS, по flexbox, CSS-анимации, CSS-grid… Однако в этом курсе мы сосредоточимся на архитектуре CSS. Если вы заинтересованы в том, чтобы научиться писать чистый и масштабируемый код CSS, этот курс - то, что вам нужно! CSS прост, его легко выучить, его легко написать. Но на самом деле сложно написать масштабируемый и удобный в сопровождении код, особенно в больших проектах, требующих постоянного масштабировани

1 ч 20 мин

Английский

Посмотреть

+18

Изображение курса Все, что я сделал, чтобы сделать CSS быстрым

Harry Roberts

10 янв. 2023 г., 01:38

CSS

Все, что я сделал, чтобы сделать CSS быстрым

Everything I Have Done to Make CSS Wizardry Fast

Моя работа как инженера по производительности заключается в том, чтобы помогать клиентам создавать и поддерживать быстрые веб-сайты. Также очень важно, чтобы мой собственный сайт служил примером! В этой серии скринкастов я покажу вам каждую функцию, решение и коммит, влияющие на производительность, которые помогли сделать CSS быстрым.

2 ч 52 мин

Английский

Посмотреть

+25

Изображение курса Семантика HTML и селекторы CSS

frontendmasters

Jen Kramer

23 июн. 2022 г., 23:20

HTML CSS

Семантика HTML и селекторы CSS

HTML Semantics & CSS Selectors

HTML - это мост между контентом и кодом. Большая буква «С» в CSS означает каскад. К сожалению, мало времени тратится на изучение того, что означает любое из этих понятий, или их влияние на ваш код. В этом курсе вы научитесь использовать семантический HTML, селекторы, наследование и каскадирование для создания веб-страниц с более компактным кодом и более эффективным стилем.

5 ч 38 мин

Английский

Посмотреть

+21

Удален по просьбе правообладателя

frontendmasters

David Khourshid

18 мая 2022 г., 23:44

CSS

CSS-анимации

CSS Animations

Анимация пользовательского интерфейса играет важную роль для веб-приложений и веб-сайтов в улучшении взаимодействия с пользователем. Но создание анимации может быть трудным или чрезмерным. На этом курсе мы изучим основы CSS-анимации и перейдем к продвинутым концепциям, таким как оркестровка и хореография. Мы также изучим принципы моушн-дизайна, которые сделают все наши анимации последовательными и продуманными.

4 ч 14 мин

Английский

Посмотреть

+57

Удален по просьбе правообладателя