updated russian file (#38484)
This commit is contained in:
@ -8,7 +8,7 @@ localeTitle: Создать многоразовый CSS с помощью Mixin
|
||||
|
||||
## Description
|
||||
<section id='description'>
|
||||
В Sass <code>mixin</code> представляет собой группу объявлений CSS, которые можно использовать повторно в таблице стилей. Новые функции CSS требуют времени, прежде чем они будут полностью приняты и готовы к использованию во всех браузерах. По мере добавления функций в браузеры, правила CSS, использующие их, могут потребоваться префиксы поставщиков. Рассмотрим «box-shadow»: <blockquote> div { <br> -webkit-box-shadow: 0px 0px 4px #fff; <br> -moz-box-shadow: 0px 0px 4px #fff; <br> -ms-box-shadow: 0px 0px 4px #fff; <br> box-shadow: 0px 0px 4px #fff; <br> } </blockquote> Очень много нужно переписать это правило для всех элементов, у которых есть <code>box-shadow</code> , или изменить каждое значение для проверки различных эффектов. <code>Mixins</code> похожи на функции CSS. Вот как написать один: <blockquote> @mixin box-shadow ($ x, $ y, $ blur, $ c) { <br> -webkit-box-shadow: $ x, $ y, $ blur, $ c; <br> -moz-box-shadow: $ x, $ y, $ blur, $ c; <br> -ms-box-shadow: $ x, $ y, $ blur, $ c; <br> box-shadow: $ x, $ y, $ blur, $ c; <br> } </blockquote> Определение начинается с <code>@mixin</code> за которым следует пользовательское имя. Параметры ( <code>$x</code> , <code>$y</code> , <code>$blur</code> и <code>$c</code> в приведенном выше примере) являются необязательными. Теперь, когда требуется правило <code>box-shadow</code> , только одна строка, вызывающая <code>mixin</code> заменяет необходимость вводить все префиксы поставщика. <code>mixin</code> вызывается с директивой <code>@include</code> : <blockquote> div { <br> @include box-shadow (0px, 0px, 4px, #fff); <br> } </blockquote>
|
||||
В Sass <code>mixin</code> представляет собой группу объявлений CSS, которые можно использовать повторно в таблице стилей. Новые функции CSS требуют времени, прежде чем они будут полностью приняты и готовы к использованию во всех браузерах. По мере добавления функций в браузеры, правила CSS, использующие их, могут потребоваться префиксы поставщиков. Рассмотрим «box-shadow»: <blockquote> div { <br> -webkit-box-shadow: 0px 0px 4px #fff; <br> -moz-box-shadow: 0px 0px 4px #fff; <br> -ms-box-shadow: 0px 0px 4px #fff; <br> box-shadow: 0px 0px 4px #fff; <br> } </blockquote> Очень много нужно переписать это правило для всех элементов, у которых есть <code>box-shadow</code> , или изменить каждое значение для проверки различных эффектов. <code>Mixins</code> похожи на функции CSS. Вот как написать один: <blockquote> @mixin box-shadow ($x, $y, $blur, $c) { <br> -webkit-box-shadow: $x $y $blur $c; <br> -moz-box-shadow: $x $y $blur $c; <br> -ms-box-shadow: $x $y $blur $c; <br> box-shadow: $x $y $blur $c; <br> } </blockquote> Определение начинается с <code>@mixin</code> за которым следует пользовательское имя. Параметры ( <code>$x</code> , <code>$y</code> , <code>$blur</code> и <code>$c</code> в приведенном выше примере) являются необязательными. Теперь, когда требуется правило <code>box-shadow</code> , только одна строка, вызывающая <code>mixin</code> заменяет необходимость вводить все префиксы поставщика. <code>mixin</code> вызывается с директивой <code>@include</code> : <blockquote> div { <br> @include box-shadow (0px, 0px, 4px, #fff); <br> } </blockquote>
|
||||
</section>
|
||||
|
||||
## Instructions
|
||||
|
Reference in New Issue
Block a user