uz
Feedback
WebTaverna /> js, css, html

WebTaverna /> js, css, html

Kanalga Telegram’da o‘tish

Уютное местечко для Frontend-разработчиков admin: @WebT_admin

Ko'proq ko'rsatish
Rossiya120 019Texnologiyalar & Aralashmalar19 834
4 724
Obunachilar
Ma'lumot yo'q24 soatlar
-77 kunlar
-3430 kunlar

Ma'lumot yuklanmoqda...

O'xshash kanallar
Айти мемы
15.5K
Айти мемы
Будни разработчика
14.3K
Будни разработчика
CSS доширак
4.9K
CSS доширак
КодВеб | Дизайн База
4.6K
КодВеб | Дизайн База
Проекты на Javascript | HTML | CSS
4.4K
Проекты на Javascript | HTML | CSS
avatar
1
Ko'proq kanallar
Taglar buluti
css20
grid15
background11
webtaverna9
width8
div7
header7
.holographic6
html6
padding6
b60aff5
display5
/div4
course.wildmanager.ru4
festivalniy.estatesochi.com4
fff4
offset4
занятость4
заём4
уровневая4
Kirish va chiqish esdaliklari
---
---
---
---
---
---
Obunachilarni jalb qilish
Iyun '26
Iyun '26
+5
0 kanalda
May '26
+16
0 kanalda
Get PRO
Aprel '26
+18
0 kanalda
Get PRO
Mart '26
+13
0 kanalda
Get PRO
Fevral '26
+18
0 kanalda
Get PRO
Yanvar '26
+29
2 kanalda
Get PRO
Dekabr '25
+32
0 kanalda
Get PRO
Noyabr '25
+47
2 kanalda
Get PRO
Oktabr '25
+19
0 kanalda
Get PRO
Sentabr '25
+22
0 kanalda
Get PRO
Avgust '25
+14
0 kanalda
Get PRO
Iyul '25
+13
0 kanalda
Get PRO
Iyun '25
+26
0 kanalda
Get PRO
May '25
+22
0 kanalda
Get PRO
Aprel '25
+45
0 kanalda
Get PRO
Mart '25
+136
10 kanalda
Get PRO
Fevral '25
+201
8 kanalda
Get PRO
Yanvar '25
+260
3 kanalda
Get PRO
Dekabr '24
+306
6 kanalda
Get PRO
Noyabr '24
+327
10 kanalda
Get PRO
Oktabr '24
+956
40 kanalda
Get PRO
Sentabr '24
+321
2 kanalda
Get PRO
Avgust '24
+623
29 kanalda
Get PRO
Iyul '24
+156
2 kanalda
Get PRO
Iyun '24
+78
0 kanalda
Get PRO
May '24
+159
0 kanalda
Get PRO
Aprel '24
+248
2 kanalda
Get PRO
Mart '24
+292
1 kanalda
Get PRO
Fevral '24
+69
0 kanalda
Get PRO
Yanvar '24
+78
1 kanalda
Get PRO
Dekabr '23
+10
0 kanalda
Get PRO
Noyabr '23
+6
0 kanalda
Get PRO
Oktabr '23
+14
1 kanalda
Get PRO
Sentabr '23
+15
0 kanalda
Get PRO
Avgust '23
+81
0 kanalda
Get PRO
Iyul '23
+89
0 kanalda
Get PRO
Iyun '23
+121
0 kanalda
Get PRO
May '23
+11
0 kanalda
Get PRO
Aprel '23
+133
0 kanalda
Get PRO
Mart '23
+203
0 kanalda
Get PRO
Fevral '23
+123
0 kanalda
Get PRO
Yanvar '23
+21
0 kanalda
Get PRO
Dekabr '22
+60
0 kanalda
Get PRO
Noyabr '22
+289
0 kanalda
Get PRO
Oktabr '22
+157
0 kanalda
Get PRO
Sentabr '22
+274
0 kanalda
Get PRO
Avgust '22
+97
0 kanalda
Get PRO
Iyul '22
+340
0 kanalda
Get PRO
Iyun '22
+115
0 kanalda
Get PRO
May '22
+82
0 kanalda
Get PRO
Aprel '22
+88
0 kanalda
Get PRO
Mart '22
+163
0 kanalda
Get PRO
Fevral '22
+215
0 kanalda
Get PRO
Yanvar '22
+226
0 kanalda
Get PRO
Dekabr '21
+257
0 kanalda
Get PRO
Noyabr '21
+448
0 kanalda
Get PRO
Oktabr '21
+281
0 kanalda
Get PRO
Sentabr '21
+327
0 kanalda
Get PRO
Avgust '21
+124
0 kanalda
Get PRO
Iyul '21
+145
0 kanalda
Get PRO
Iyun '21
+385
0 kanalda
Get PRO
May '21
+141
0 kanalda
Get PRO
Aprel '21
+110
0 kanalda
Get PRO
Mart '21
+600
0 kanalda
Sana
Obunachilarni jalb qilish
Esdaliklar
Kanallar
17 Iyun0
16 Iyun0
15 Iyun0
14 Iyun+1
13 Iyun0
12 Iyun+2
11 Iyun0
10 Iyun0
09 Iyun+1
08 Iyun0
07 Iyun0
06 Iyun0
05 Iyun0
04 Iyun0
03 Iyun+1
02 Iyun0
01 Iyun0
Kanal postlari
WebTaverna /> js, css, html
🪞 Зеркальное отражение текста с помощью CSS HTML разметка ⤵️ WebTaverna CSS стили ⤵️ h1 { position: relative; color: #fff; f
🪞 Зеркальное отражение текста с помощью CSS HTML разметка ⤵️ 
<h1 data-text="WebTaverna">WebTaverna</h1>
CSS стили ⤵️ 
h1 {
  position: relative;
  color: #fff;
  font-size: 5em;
  font-weight: 800;
}
h1:before {
  content: attr(data-text);
  position: absolute;
  transform-origin: bottom;
  transform: rotateX(180deg);
  line-height: 1em;
  background: linear-gradient(0deg, #ffffff88 0, rgba(255, 255, 255, 0) 80%);
  -webkit-background-clip: text;
  color: rgba(0, 0, 0, 0);
  opacity: 0.5;
}
👍- если было полезно | ➡️ WebTaverna

2
Matn yo'q...
683
3
Matn yo'q...
876
4
Анимация в URL с помощью JavaScript и Emoji 👨‍💻 const myEmojis = ['😃', '🤨', '😡'] function urlAnimate () { window.locatio
Анимация в URL с помощью JavaScript и Emoji 👨‍💻 const myEmojis = ['😃', '🤨', '😡'] function urlAnimate () { window.location.hash = myEmojis [Math.floor((Date.now()/100)%myEmojis.length)] setTimeout(urlAnimate, 1000) } urlAnimate() 👍- если было полезно | ➡️ WebTaverna
957
5
🔰 Шпаргалка по CSS свойству transform transform позволяет применять двумерные и трёхмерные преобразования к элементам, измен
🔰 Шпаргалка по CSS свойству transform transform позволяет применять двумерные и трёхмерные преобразования к элементам, изменяя их форму, размер и положение. В общем виде свойство transform записывается так: transform: функция(значение);, где функция — это тип преобразования, а значение — параметры этого преобразования. Свойство transform принимает следующие значения: 🔜 none — никакого преобразования не применяется; 🔜 rotate(angle) — вращает элемент на заданный угол; 🔜 scale(x, y) — масштабирует элемент по осям X и Y; 🔜 translate(x, y) — перемещает элемент на заданные координаты; 🔜 skew(x-angle, y-angle) — наклоняет элемент на заданные углы по осям X и Y. Transform не должен использоваться для изменения основной структуры веб-страницы. Он нужен для создания эффектов и анимаций, а не для основного макета страницы. 👍- если было полезно | ➡️ WebTaverna
0
6
Matn yo'q...
1 038
7
Проверяем, правильно ли заполнено поле ввода с цифрами? 🔍 Решить эту задачу нам помогут псевдоклассы в CSS :in-range и :out-
Проверяем, правильно ли заполнено поле ввода с цифрами? 🔍 Решить эту задачу нам помогут псевдоклассы в CSS :in-range и :out-of-range, которые используются для стилизации полей ввода, поддерживающих атрибуты min и max 🔜 :in-range - введённое значение попадает в диапазон от min до max; 🔜 :out-of-range - не попадает в диапазон от min до max. Пример ⤵️ <input type="number" min="1" max="3"> input:in-range { background-color: #17a992; border: 5px solid #006776; } input:out-of-range { background-color: #f4a898; border: 5px solid #e62a5a; } Атрибуты min и max могут иметь поля ввода с типами date, month, week, time, datetime-local, number и range, в которых эти атрибуты задают диапазон допустимых значений, которые пользователь может вводить в поле. 👍- если было полезно | ➡️ WebTaverna
840
8
Matn yo'q...
650
9
Маскирование в CSS c помощью свойства mask ☀️ Данное CSS свойство устанавливает изображение, которое используется как слой ма
Маскирование в CSS c помощью свойства mask ☀️ Данное CSS свойство устанавливает изображение, которое используется как слой маски для элемента ⤵️ img { mask: url("./graph.png"); mask-repeat: no-repeat; mask-size: cover; mask-position: center; } 🔜 mask: url() - задаём png изображение слоя-маски; 🔜 mask-repeat - определяем порядок повторений; 🔜 mask-size - определяем размеры изображения-маски; 🔜 mask-position - устанавливаем начальную позицию относительно слоя; Также это можно записать в одну строку ⤵️ img { mask: url("./graph.png") center/cover no-repeat; } 👍- если было полезно | ➡️ WebTaverna
0
10
Matn yo'q...
0
Barcha postlarni ko‘rish