CSS свойство clip-path на живых примерах

Uploaded By: Myvideo

Published on

2 Jun 2023

1 view

0

0 votes

0

About Share Download Add to

Друзья, всем привет! Рад приветствовать на своем канале, посвященном верстке, веб-разработке, frontend-разработке - называйте как хотите. В этом видео расскажу об очень интересном, весьма полезном и далеко не всеми известном css-свойстве, таком как clip-path. Разберем его на трех практических примерах: один попроще (для общего понимания) и два немного поинтереснее. Поработаем также с макетом из фигма. Так что усаживайтесь поудобнее, надеюсь видео будет полезным. Материалы урока: 1) макет фигма: 2) дополнительные материалы для чтения: - - - (clip-path генератор) Таймкоды: 00:00 Вступление 00:45 Пример 1 05:30 Пример 2 23:00 Пример 3 Мой telegram: @Pasha05_01 Мой e-mail: pashok05_01@ Мой linkedin: павел-федоров-68aa321ba/ #frontend #CSS #HTML #web #clipPath #простоверсткаверсткапросто

Share with your friends

Link:

Embed:

<iframe width="640" height="360" src="//myvideo.cc/embed/UkxhUGIxNmtna1lFNXRQbjVWdjd5Z0FYbklkanJNV005cnZXSWpGcEx6bz0" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

Video Size:

Custom size:

x

Autoplay video

Hide player controls

Hide resume playing

Add to Playlist:

Favorites

My Playlist

Watch Later

Кастомный скролл на CSS | Изменяем и улучшаем поведение scrollbar на веб-странице | Магнитный scroll

17 hours ago

00:12:41

Кастомный скролл на CSS | Изменяем и улучшаем поведение scrollbar на веб-странице | Магнитный scroll

39 34%

cs 1.6 #cs #1.6

4 days ago

00:59:25

cs 1.6 #cs #1.6

364 60%

cs 1.6 #cs #1.6 #shorts

2 weeks ago

03:21:56

cs 1.6 #cs #1.6 #shorts

362 79%

Позиционирование в CSS. Свойство - Position. Значения: Absolute, fixed

3 weeks ago

00:19:19

Позиционирование в CSS. Свойство - Position. Значения: Absolute, fixed

5 72%

Позиционирование в CSS. Свойство - Position. Значение - Sticky

3 weeks ago

00:09:45

Позиционирование в CSS. Свойство - Position. Значение - Sticky

6 81%

СSS свойство. z-index

3 weeks ago

00:17:02

СSS свойство. z-index

1 64%

CSS свойство - Box-sizing

3 weeks ago

00:05:05

CSS свойство - Box-sizing

1 58%

Line-height. Межстрочный интервал в CSS

3 weeks ago

00:11:58

Line-height. Межстрочный интервал в CSS

1 12%

CSS свойства max-width и min-width. В чём разница Реальные примеры

3 weeks ago

00:05:57

CSS свойства max-width и min-width. В чём разница Реальные примеры

2 26%

CurrentColor. Удобный способ унаследовать цвет текста родительского элемента

3 weeks ago

00:03:22

CurrentColor. Удобный способ унаследовать цвет текста родительского элемента

4 61%

White-space: nowrap Запрещаем перенос текста на новую строку

3 weeks ago

00:01:59

White-space: nowrap Запрещаем перенос текста на новую строку

1 9%

Scroll-padding-top. Решение проблемы при прокрутке сайта

3 weeks ago

00:02:44

Scroll-padding-top. Решение проблемы при прокрутке сайта

1 22%

background-clip:text Задаём тексту фоновое изображение

3 weeks ago

00:05:52

background-clip:text Задаём тексту фоновое изображение

1 30%

Трансформации в CSS. Свойство - Transform. Значение - Translate

3 weeks ago

00:10:02

Трансформации в CSS. Свойство - Transform. Значение - Translate

1 49%

Трансформации в CSS. Свойство - Transform. Значение - Scale

3 weeks ago

00:06:54

Трансформации в CSS. Свойство - Transform. Значение - Scale

1 50%

Трансформации в CSS. Свойство - Transform. Значение - Rotate

3 weeks ago

00:10:44

Трансформации в CSS. Свойство - Transform. Значение - Rotate

1 25%

Трансформации в CSS. Свойство - Transform. Значение - Skew

3 weeks ago

00:02:39

Трансформации в CSS. Свойство - Transform. Значение - Skew

1 76%

Жирная насыщенность шрифта без использования свойства font weight, - text-shadow

3 weeks ago

00:02:57

Жирная насыщенность шрифта без использования свойства font weight, - text-shadow

1 95%

Пользовательские свойства как основа архитектуры CSS / Павел Ловцевич (LOVATA)

3 weeks ago

00:41:43

Пользовательские свойства как основа архитектуры CSS / Павел Ловцевич (LOVATA)

1 32%

CSS для Начинающих - Практический Курс

4 weeks ago

01:47:36

CSS для Начинающих - Практический Курс

1 95%

webDev CSS Flexbox #11 Практические примеры использования Flexbox (Practical examples)

1 month ago

00:06:33

webDev CSS Flexbox #11 Практические примеры использования Flexbox (Practical examples)

39 40%

Автоматизированное тестирование с нуля / Полный курс за 3 часа / selenium + testng

1 month ago

03:29:51

Автоматизированное тестирование с нуля / Полный курс за 3 часа / selenium + testng

1 80%

Flexbox | FLEX-DIRECTION | Указываем направление главной оси

1 month ago

00:10:13

Flexbox | FLEX-DIRECTION | Указываем направление главной оси

8 82%

Flexbox | JUSTIFY-CONTENT | Определяем как будут выровнены элементы вдоль главной оси

1 month ago

00:07:56

Flexbox | JUSTIFY-CONTENT | Определяем как будут выровнены элементы вдоль главной оси

1 86%

0 Comments

Guest