Съдържание:

Как да създам мрежово оформление в CSS?
Как да създам мрежово оформление в CSS?

Видео: Как да създам мрежово оформление в CSS?

Видео: Как да създам мрежово оформление в CSS?
Видео: Готовый интернет магазин за 3 вебинара: обслуживание сайта 2024, Април
Anonim

Нека обобщим четирите основни стъпки:

  1. Създайте контейнерен елемент и го декларирайте за показване: мрежа ;.
  2. Използвайте същия контейнер, за да дефинирате мрежа песни с помощта на мрежа - шаблон -колони и мрежа - шаблон -редове свойства.
  3. Поставете дъщерни елементи в контейнера.
  4. Посочете размерите на улуците с помощта на мрежа -пропуски свойства.

Тук мога ли да използвам оформление на CSS мрежа?

Освен в Internet Explorer, Оформление на CSS мрежа е без префикс в Safari, Chrome, Opera, Firefox и Edge. Поддръжката на всички свойства и стойности, описани подробно в тези ръководства, е оперативно съвместима между браузърите. Това означава, че ако напишете някои Оформление на мрежата код във Firefox, той трябва да работи по същия начин в Chrome.

Освен това трябва ли да използвам Flexbox или мрежа? И двете flexbox и мрежа се основават на тази концепция. Flexbox е най-доброто за подреждане на елементи в един ред или в една колона. Решетка е най-подходящ за подреждане на елементи в множество редове и колони. Свойството justify-content определя как допълнителното пространство на огъване -контейнерът се разпределя на огъване - предмети.

По същия начин какво е 1fr?

1fr е една "дробна единица", което е начин да се каже "оставащото пространство в елемента".

Какво е Flexbox мрежа?

Flexbox е направен за едномерни оформления и Решетка е направен за двумерни оформления. Това означава, че ако подреждате елементи в една посока (например три бутона в заглавка), тогава трябва да използвате Flexbox : Ще ви даде повече гъвкавост от CSS Решетка.

Препоръчано: