Там собраны все основные Css-свойства, которые точно понадобятся всем разработчикам, ниже можешь посмотреть на фулл версию.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍22🔥5
Эти методы JavaScript часто вызывают путаницу, т.к их названия похожи, но цели и поведение — разные. Разберем, за что отвечает каждый из них:
•
slice
— создает новый массив, копируя выбранную часть исходного массива, при этом сам оригинал остается неизменным. Он принимает два аргумента: начальный индекс и конечный индекс.
•
splice
— модифицирует исходный массив, позволяя удалять, добавлять или заменять элементы. Он принимает три аргумента: начальный индекс, количество удаляемых элементов и элементы для добавления.
Использование с примером кода и доп. информацию, смотри на картинках выше
🔥 — если было полезно
🤝 — если уже пользовался
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥38👍14🤝8
This media is not supported in your browser
VIEW IN TELEGRAM
Недавно я публиковал шпаргалку по флексам, теперь пришло время показать вам — CSS Flex Generator
Это онлайн-инструмент, который позволяет визуально настраивать и генерировать код для CSS Flexbox, упрощая создание гибких макетов.
📌 Ссылочка: cssflex-generator
📣 Code Ready | #ресурс
Это онлайн-инструмент, который позволяет визуально настраивать и генерировать код для CSS Flexbox, упрощая создание гибких макетов.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍24🔥8👎2
В общем, это два разных CSS-свойства для создания теней, но они применяются в разных случаях и имеют разные особенности. Рассмотрим их по очереди:
• box-shadow — добавляет тень к рамке элемента, то есть вокруг его границ. Это свойство работает с любыми элементами, создавая тень, повторяющую контуры элемента.
• drop-shadow — применяется с функцией
filter
и позволяет создавать более сложные тени для графики и текстов. Оно учитывает прозрачность и форму содержимого элемента, что особенно полезно для изображений и SVG.Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍35🔥10
Please open Telegram to view this post
VIEW IN TELEGRAM
😁89🔥11🤝1
18 подробных уроков для изучения html с самого нуля.
В курсе подробно рассматриваются основы HTML, включая создание и структуру веб-страниц. Курс предназначен для начинающих.
Ссылочка на плейлист: YouTube🖤
Please open Telegram to view this post
VIEW IN TELEGRAM
👍35🔥6🤝1
👍24😁15🔥10
This media is not supported in your browser
VIEW IN TELEGRAM
Это можно сделать, с помощью плагин VS Code — CodeSnap, который предназначенный для создания как раз скриншотов кода.
Чтобы не париться, а быстро понять его интерфейс и научиться правильно использовать, я оставляю ссылку на видео для настройки этого плагина.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍48🔥21
21 урок для изучения css с самого нуля. Курс
охватывает основы CSS, включая стилизацию и оформление веб-страниц, и предназначен для начинающих.
Ссылочка на курс: YouTube🖤
Please open Telegram to view this post
VIEW IN TELEGRAM
👍19🔥7
Знакомы с этим свойством? Благодаря свойству backdrop-filter в CSS, вы можете применить фильтры к элементу, который находится за ним, создавая уникальные и привлекательные визуальные эффекты.
Может принимать следующие значения:
• none — фильтры не применяются (по умолчанию)
• blur — размывает элемент
• brightness — изменяет яркость
• contrast — изменяет контрастность
• grayscale — преобразует элемент в оттенки серого
• hue-rotate — вращает цветной круг элемента
• invert — инвертирует цвета
• opacity — изменяет прозрачность
• saturate — изменяет насыщенность цветов
• sepia — применяет сепийный фильтр к элементу
Please open Telegram to view this post
VIEW IN TELEGRAM
👍14🔥4
This media is not supported in your browser
VIEW IN TELEGRAM
Screeps: World — это многопользовательская стратегическая игра, в которой игроки программируют своих юнитов на Javascript для управления колониями и сражаются за ресурсы в открытом мире.
📣 Code Ready | #игры
Ссылочка: store.steampowered🙄
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥23👍11
Сброс и нормализация CSS — это два подхода к управлению базовыми стилями на веб-странице, но их цели и методы различаются.
• Сброс — это процесс удаления всех браузерных стилей по умолчанию. Цель сброса — создать абсолютно «чистую» страницу, где все элементы, такие как отступы, шрифты и марджины, будут иметь нейтральные значения, чтобы устранить различия между браузерами.
• Нормализация — это подход, который стремится обеспечить единообразие отображения элементов в разных браузерах. Она исправляет стили, чтобы они выглядели одинаково во всех браузерах, но не удаляет все настройки, как в случае со сбросом.
В итоге, сброс полностью обнуляет стили, а нормализация старается выровнять стили, не нарушая базовых настроек.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍16🔥5
This media is not supported in your browser
VIEW IN TELEGRAM
Stepik — это обучающая платформа, которая предоставляет онлайн-курсы и интерактивные задания по программированию.
📌 Ссылочка: stepik.org
📣 Code Ready | #ресурсы
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥16👍8
Часто задаваемый вопрос, как создать нормальное оформление кода? Сегодня пришло время раскрыть тайну и показать как это сделать на самом деле.
Для того чтобы сделать оформление, нужно:
1. Начинаем с указания языка:
Чтобы Telegram правильно распознал формат кода, на первой строке пишем три обратных кавычки (```) и указываем язык, например html (```html)
2. После кавычек, на второй строке уже можно вставить сам код, который хотим оформить:
(<div class="div"> <h1>Любой код</h1></div>)
3. После того как вставили код, не забываем в конце добавить еще три обратных кавычки без пробела (```)
Как это выглядит:
```html
<div class="div">
<h1>Любой код</h1>
</div>```
Результат:
<div class="div">
<h1>Любой код</h1>
</div>
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥24👍14
This media is not supported in your browser
VIEW IN TELEGRAM
Уже было много постов про css свойства, но есть один сайт, на котором собрано сразу всё.
CSS Click Chart — ресурс, с помощью которого можно кликнуть на любое css свойство, и сразу увидеть его пример и как оно работает. Также отображается поддержка браузерами.
📌 Ссылочка: css3clickchart.com
📣 Code Ready | #ресурсы
CSS Click Chart — ресурс, с помощью которого можно кликнуть на любое css свойство, и сразу увидеть его пример и как оно работает. Также отображается поддержка браузерами.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍21🔥6