Лучший сброс CSS

RedDeveloper
02.01.2023 19:41
Лучший сброс CSS

Стиль CSS Reset - это список правил, которые "сбрасывают" все стили браузера по умолчанию.

Этот стиль сброса CSS не является стандартным, хотя любой сброс CSS не является стандартным. Я следовал этому CSS-сбросу большую часть времени. Этот сброс имеет мой личный оттенок, поэтому он очень субъективен.

*,
*::before,
*::after {
  box-sizing: border-box;
}

* {
  margin: 0;
  padding: 0;
  font: inherit;
}

:focus-visible {
  outline-offset: 0;
}

::-moz-selection {
  background-color: #b3d4fc;
  color: #000000;
  text-shadow: none;
}

::selection {
  background-color: #b3d4fc;
  color: #000000;
  text-shadow: none;
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeSpeed;
}

html,
body {
  height: 100%;
}

ul,
ol {
  list-style: none;
}

a {
  color: inherit;
  text-decoration: none;
}

svg {
  display: inline-block;
  max-width: 100%;
}

img,
picture,
video,
canvas {
  display: block;
  max-width: 100%;
}

button {
  cursor: pointer;
  border-radius: 0;
  border: none;
  background-color: transparent;
}

input,
textarea,
select {
  color: inherit;
  letter-spacing: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

Вот мой github репозиторий для таблицы стилей CSS reset. если вам нравится, дайте звезду и следуйте за ним.

Ресурсы

https://www.joshwcomeau.com/css/custom-css-reset/

https://piccalil.li/blog/a-modern-css-reset/

Ускорьте разработку веб-приложений Laravel с помощью этих бесплатных стартовых наборов
Ускорьте разработку веб-приложений Laravel с помощью этих бесплатных стартовых наборов

31.03.2023 11:40

Laravel - это мощный PHP-фреймворк, используемый для создания масштабируемых и надежных веб-приложений. Одним из преимуществ Laravel является его обширная экосистема пакетов и стартовых наборов, которые делают создание веб-приложений более быстрым и эффективным. В этой статье мы рассмотрим лучшие...

Что такое двойные вопросительные знаки (??) в JavaScript?
Что такое двойные вопросительные знаки (??) в JavaScript?

31.03.2023 11:16

Как безопасно обрабатывать неопределенные и нулевые значения в коде с помощью Nullish Coalescing

Создание ресурсов API Laravel: Советы по производительности и масштабируемости
Создание ресурсов API Laravel: Советы по производительности и масштабируемости

31.03.2023 11:06

Создание API-ресурса Laravel может быть непростой задачей. Она требует глубокого понимания возможностей Laravel и лучших практик, чтобы обеспечить масштабируемость, производительность и безопасность вашего API. В этой статье мы рассмотрим несколько советов по созданию ресурсов API Laravel,...

Как сделать компонент справочного центра с помощью TailwindCSS
Как сделать компонент справочного центра с помощью TailwindCSS

31.03.2023 10:15

Справочный центр - это веб-сайт, где клиенты могут найти ответы на свои вопросы и решения своих проблем. Созданный для решения многих распространенных вопросов, которые получает бренд, справочный центр должен упрощать клиентам поиск ответов, которые они ищут.

Асинхронная передача данных с помощью sendBeacon в JavaScript
Асинхронная передача данных с помощью sendBeacon в JavaScript

30.03.2023 14:11

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

Как подобрать выигрышные акции с помощью анализа и визуализации на Python
Как подобрать выигрышные акции с помощью анализа и визуализации на Python

30.03.2023 13:54

Отказ от ответственности: Эта статья предназначена только для демонстрации и не должна использоваться в качестве инвестиционного совета.