ПРОБЛЕМА #1 | Несколько границ на одном блоке!

Автор Andrei Golubev
ПРОБЛЕМА #1 | Несколько границ на одном блоке!

Всем привет.

С вами снова Defender в этом уроке. Я покажу как же добавлять несколько границ как блок давайте займемся с таким скинграде вот так, что так поставим ширину высоту 100 пикселей background сделаем 497 допустим так. Какие же у нас есть способы для добавления границ 1 способ — это способ с помощью box-shadow вы знаете.

Бог добавляет у нас день по нашему блоком и у неё у него был жену если известный так сказать аргументы у нас его Boxer как допустим 5 пикселей дефицитный потом цвет и разброс развлеки нас как бы получается такая тень, но с помощью неё можно создать тень которая будет как бы границей во-первых потому, что у нас на собак шагов есть ещё 4 аргументы которые можно указать чтобы указать определенную разброс в тени тонов в большой — это указывается четвёртым параметрам допустим 9 пикселей гораздо больше — это основные параметры которые позволяют нам создавать такие вещи, а потом нам нужно ещё указать 000 чтобы она была полностью посередине не развелась я сама получаем уже вот такую вот полностью похожа на границу день как бы так сказать её давайте я ухожу вариант её минус в том, что она.

Нам же нужно две границы мышь для этого даже не только когда несколько границ. Как вы знаете она ещё не значит то, что можно добавить несколько дней поэтому их как бы добавляются через запятую то есть опять указывается 5000 и указываем разброс ширину создать тень как бы то из-за шириной 5 пикселей 5 пикселей. Ну и чёрную и смотрим, но почему-то у нас — это нету. А почему же, а всё потому, что она налаживается на неё всё, что левее она как бы по слоям. Выше всё, что проверь по слоям ниже, а так как у. Насти относительно одного центра позиционируется 200 то есть они вот этот день красные она ложилась на неё и она тоже ширины она ложилась и просто нашел черную тень закрыли то есть чтобы нам делать тоже ширины должны сделать её в два раза больше по ширине то есть 10 пикселей и вот вот мы — это сделать на вторую тень вторую границу. Можно опять поставить запятую 30000 и допустим ещё у нас уже 10 пикселей занята. То есть если от 1 до 10 писем какой-то. Шарлотта это. Это у тебя не увидел любом случае то есть давай 13 — это у нас будет если — это будет у нас день шириной 3 пикселей. Давайте поставим больше 19 9 пиксельный назвали тянется и допустим Orange и вот у нас теперь красное. Чёрное и оранжевый океан, что без границ. А, что здесь не так во-первых, что нужно понимать то, что этот день она у нас не входит в макет она у нас не. Ну и как бы не портит макет не говорит сам она этот этот. Макет как бы не не меняет такая небольшая было бы этот день она не меняет макет никак не на него не действует и она никак этот блок не отталкивает она просто есть не только как бы если у нас будет box-sizing border-box то — это вообще ничего не даст также нужно знать, что этот день она. Ну не срабатывает если мы поставили наведении на блок. Допустим джаваскрипте мы включили чтобы что-то происходило по наведению на этот блок если наведена тени кто это. Не сработает — это нужно тоже знать. Ну, что если нам нужно денег которая будет. Допустим точками или штрих пунктир пунктир. У меня такого нет страховая будет в страховой. Для этого нам понадобится. ВСК онлайн минус свойство outline в том, что — это свойство позволяет добавить только вторую страницу, но но никак не 3 или 4 то есть. Давайте сделаем Border допустим 45 в рассоле открыт — это будет граница. А теперь добавим поутру они тоже 4 пикселя дальше. И как видите мы добавили вторую границу если мы начнём попытаемся как с тенями вписать пятую какую-нибудь третью границу то у нас ничего не получится можете не тратить на — это время вообще ничего не появляется то есть — это вызывает ошибку мы можем добавить только один онлайн, но необычное свойство outline заключается в том, что у него есть такой ещё дополнительные свойства так outline-offset если я ничего не путаю или в этом плане и здесь мы можем списать на столько на сколько пикселей мы можем оттолкнуть от самого блока нашёл. Нашёл твой допустим на 10 пикселей тем самым outline. Как видите уйдёт от блока то есть будет отступ outline от границы, но еще забавнее то, что есть отрицательные значения его записать 10 пикселей тем самым мы увидим, что нас онлайн вошёл в блок и — это выглядит реально прикольно тем самым можно вписать -4 пиксели и наш онлайн будет как бы на границей и у нас получится от как бы грани чередуются то красный то чёрный и вот — это уже реально прикольно советую. Всем рекомендую пока.

0 комментариев
0

Читайте также