From 9a96229818a3971444a77c238cc5ae45921db1bf Mon Sep 17 00:00:00 2001 From: Alexey Pyltsyn Date: Tue, 23 Mar 2021 21:32:09 +0300 Subject: Fix capitalization of Russian pronouns (#294) * Fix capitalization of Russian pronouns * Apply suggestions from code review Co-authored-by: Alexander Myshov * Update files/ru/web/mathml/element/math/index.html Co-authored-by: Alexander Myshov Co-authored-by: Alexander Myshov --- .../advanced_styling_effects/index.html | 10 ++--- .../backgrounds_and_borders/index.html | 6 +-- .../cascade_and_inheritance/index.html | 2 +- .../css/building_blocks/cascade_tasks/index.html | 2 +- .../images_media_form_elements/index.html | 2 +- files/ru/learn/css/building_blocks/index.html | 26 +++++------ .../learn/css/building_blocks/selectors/index.html | 6 +-- .../selectors/selectors_tasks/index.html | 2 +- .../css/building_blocks/the_box_model/index.html | 2 +- files/ru/learn/css/css_layout/flexbox/index.html | 4 +- files/ru/learn/css/css_layout/grids/index.html | 2 +- files/ru/learn/css/css_layout/index.html | 2 +- .../ru/learn/css/css_layout/positioning/index.html | 4 +- .../css/css_layout/responsive_design/index.html | 2 +- .../css/first_steps/getting_started/index.html | 50 +++++++++++----------- .../first_steps/how_css_is_structured/index.html | 2 +- .../learn/css/first_steps/how_css_works/index.html | 12 +++--- files/ru/learn/css/first_steps/index.html | 2 +- .../using_your_new_knowledge/index.html | 14 +++--- .../learn/css/first_steps/what_is_css/index.html | 24 +++++------ files/ru/learn/css/index.html | 10 ++--- .../css/styling_text/styling_links/index.html | 4 +- .../ru/learn/css/styling_text/web_fonts/index.html | 4 +- 23 files changed, 97 insertions(+), 97 deletions(-) (limited to 'files/ru/learn/css') diff --git a/files/ru/learn/css/building_blocks/advanced_styling_effects/index.html b/files/ru/learn/css/building_blocks/advanced_styling_effects/index.html index 98c1d9b0a9..59ff2e0d03 100644 --- a/files/ru/learn/css/building_blocks/advanced_styling_effects/index.html +++ b/files/ru/learn/css/building_blocks/advanced_styling_effects/index.html @@ -19,7 +19,7 @@ translation_of: Learn/CSS/Building_blocks/Advanced_styling_effects ---
{{LearnSidebar}}
-

В этой статье описаны некоторые хитрости, которые познакомят Вас с такими узкоспециализированными свойствами, как box-shadow, режимы смешивания и фильтры.

+

В этой статье описаны некоторые хитрости, которые познакомят вас с такими узкоспециализированными свойствами, как box-shadow, режимы смешивания и фильтры.

@@ -114,7 +114,7 @@ article {

{{ EmbedLiveSample('Несколько_теней', '100%', 100) }}

-

Мы сделали контейнер с несколькими ступенчатыми цветными тенями, но Вы можете делать, как считаете то нужным, например, чтобы добавить реалистичности, опираясь на какие-нибудь источники света.

+

Мы сделали контейнер с несколькими ступенчатыми цветными тенями, но вы можете делать, как считаете то нужным, например, чтобы добавить реалистичности, опираясь на какие-нибудь источники света.

Другие опции блок-теней

@@ -195,7 +195,7 @@ button:active {

background-blend-mode

-

Снова обратимся к примеру. Во-первых, {{cssxref("background-blend-mode")}} — мы покажем несколько контейнеров {{htmlelement("div")}}, чтобы Вы сравнили оригинал с редактированной версией:

+

Снова обратимся к примеру. Во-первых, {{cssxref("background-blend-mode")}} — мы покажем несколько контейнеров {{htmlelement("div")}}, чтобы вы сравнили оригинал с редактированной версией:

<div>
 </div>
@@ -288,7 +288,7 @@ article div:last-child {
 
Как видите, смешались не только фоновые изображения, но и <div> под ними.

 
 

-
Примечание: Не переживайте, если Вы не знаете такие свойства разметки, как {{cssxref("position")}}, {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("z-index")}} и т. д. Мы детально рассмотрим это в модуле CSS Layout.

+
Примечание: Не переживайте, если вы не знаете такие свойства разметки, как {{cssxref("position")}}, {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("z-index")}} и т. д. Мы детально рассмотрим это в модуле CSS Layout.

 

 
 
CSS-фигуры

@@ -302,7 +302,7 @@ article div:last-child {
 
Форма в этом примере не реагирует на содержание изображения. Вместо этого в центре изображения определяется центр окружности, как если бы мы начертили циркулем окружность, вписанную в изображение. Это та окружность, которую обтекает текст.

 
 

-
Примечание: В Firefox Вы можете использовать Инспектор фигур, чтобы редактировать фигуры.

+
Примечание: В Firefox вы можете использовать Инспектор фигур, чтобы редактировать фигуры.

 

 
 
Значение circle() — лишь одно из нескольких базовых фигур для этого свойства, но можно и создавать формы. (Читайте Обзор CSS-фигур на MDN.)

diff --git a/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html b/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html
index 71587be09c..e521b20fa4 100644
--- a/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html
+++ b/files/ru/learn/css/building_blocks/backgrounds_and_borders/index.html
@@ -160,7 +160,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders
 
 
Градиент - при использовании для фона - действует так же, как изображение, и поэтому задаётся свойством {{cssxref ("background-image")}}.

 
-
Вы можете прочитать больше о различных типах градиентов и о том, что вы можете с ними делать на странице MDN для типа данных <gradient>. Поиграть с градиентами Вы можете используя один из многих генераторов градиентов CSS, доступных в Интернете, например этот. Вы можете создать градиент, а затем скопировать и вставить его в свой код.

+
Вы можете прочитать больше о различных типах градиентов и о том, что вы можете с ними делать на странице MDN для типа данных <gradient>. Поиграть с градиентами вы можете используя один из многих генераторов градиентов CSS, доступных в Интернете, например этот. Вы можете создать градиент, а затем скопировать и вставить его в свой код.

 
 
Попробуйте использовать разные градиенты в примере ниже. В двух блоках соответственно у нас есть линейный градиент, растянутый на весь блок, и радиальный градиент с заданным размером, который поэтому повторяется.

 
@@ -170,7 +170,7 @@ translation_of: Learn/CSS/Building_blocks/Backgrounds_and_borders
 
 
Также возможно создавать несколько фоновых изображений — просто разделив значения свойства background-image запятыми.

 
-
Когда Вы сделаете это, произойдёт наложение фоновых изображений друг на друга. Фоновые изображения будут наложены слоями, где каждое новое фоновое изображение, перечисленное в коде, будет накладываться поверх ранее указанного изображения. 

+
Когда вы сделаете это, произойдёт наложение фоновых изображений друг на друга. Фоновые изображения будут наложены слоями, где каждое новое фоновое изображение, перечисленное в коде, будет накладываться поверх ранее указанного изображения. 

 
 

 
Примечание: Градиенты можно легко смешивать с обычными фоновыми изображениями.

@@ -296,7 +296,7 @@ background-position: 10px 20px,  top right;

{{EmbedGHLiveSample("css-examples/learn/backgrounds-borders/task.html", '100%', 555)}} 

-

Примечание: Вы можете посмотреть решение здесь — но сначала попробуйте сделать это сами!

+

Примечание: вы можете посмотреть решение здесь — но сначала попробуйте сделать это сами!

Итоги

diff --git a/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html b/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html index dd8cf674a5..c43e8e822a 100644 --- a/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html +++ b/files/ru/learn/css/building_blocks/cascade_and_inheritance/index.html @@ -14,7 +14,7 @@ translation_of: Learn/CSS/Building_blocks/Cascade_and_inheritance ---
{{LearnSidebar}}{{NextMenu("Learn/CSS/Building_blocks/Selectors", "Learn/CSS/Building_blocks")}}
-

Цель этого урока — углубить Ваше понимание некоторых основополагающих концепций CSS — каскадов, спецификаций и наследования, — которые контролируют то, как CSS применяется к HTML и как разрешаются конфликты.

+

Цель этого урока — углубить ваше понимание некоторых основополагающих концепций CSS — каскадов, спецификаций и наследования, — которые контролируют то, как CSS применяется к HTML и как разрешаются конфликты.

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

diff --git a/files/ru/learn/css/building_blocks/cascade_tasks/index.html b/files/ru/learn/css/building_blocks/cascade_tasks/index.html index b7580f53e0..261b742ec9 100644 --- a/files/ru/learn/css/building_blocks/cascade_tasks/index.html +++ b/files/ru/learn/css/building_blocks/cascade_tasks/index.html @@ -14,7 +14,7 @@ original_slug: Learn/CSS/Building_blocks/Каскад_задачи

Цель этого задания — помочь вам проверить ваше понимание некоторых значений и элементов, которые мы рассмотрели в уроке Каскад и наследование.

-

Примечание: Вы можете проверять решения в интерактивном редакторе, расположенном ниже, но, возможно, вам будут полезны онлайн-инструменты, такие как  CodePen, jsFiddle или Glitch, которые можно использовать для работы над заданием, предварительно загрузив в них код.
+

Примечание: вы можете проверять решения в интерактивном редакторе, расположенном ниже, но, возможно, вам будут полезны онлайн-инструменты, такие как  CodePen, jsFiddle или Glitch, которые можно использовать для работы над заданием, предварительно загрузив в них код.

Если вы зашли в тупик, обратитесь к нам за помощью — смотрите раздел {{anch("Оценка или дальнейшая помощь")}} внизу этой страницы.

diff --git a/files/ru/learn/css/building_blocks/images_media_form_elements/index.html b/files/ru/learn/css/building_blocks/images_media_form_elements/index.html index b7f68a3e29..910edf7ce4 100644 --- a/files/ru/learn/css/building_blocks/images_media_form_elements/index.html +++ b/files/ru/learn/css/building_blocks/images_media_form_elements/index.html @@ -112,7 +112,7 @@ textarea {

Элементы форм и box-sizing

-

В разных браузерах элементы формы используют разные правила определения размеров блоков для разных виджетов. Вы изучали свойство box-sizing в нашем уроке Блоки в CSS и можете использовать эти знания при стилизации форм для обеспечения единообразия при настройке ширины и высоты элементов форм.

+

В разных браузерах элементы формы используют разные правила определения размеров блоков для разных виджетов. вы изучали свойство box-sizing в нашем уроке Блоки в CSS и можете использовать эти знания при стилизации форм для обеспечения единообразия при настройке ширины и высоты элементов форм.

Для единообразия рекомендуется устанавливать margin и padding на 0 для всех элементов, а затем добавлять их (margin и padding) при стилизации отдельных элементов.

diff --git a/files/ru/learn/css/building_blocks/index.html b/files/ru/learn/css/building_blocks/index.html index 8f2b09449c..a5873dd2cd 100644 --- a/files/ru/learn/css/building_blocks/index.html +++ b/files/ru/learn/css/building_blocks/index.html @@ -15,13 +15,13 @@ translation_of: Learn/CSS/Building_blocks ---
{{LearnSidebar}}
-

Этот модуль — продолжение раздела Введение в CSS: Вы уже знакомы с синтаксисом языка и опробовали основные функции; пришло время углубиться в CSS. В этом модуле рассматриваются каскады и наследование, все доступные типы селекторов, блоков, изменений размеров, фонов, границ, а также отладка и многое другое.

+

Этот модуль — продолжение раздела Введение в CSS: вы уже знакомы с синтаксисом языка и опробовали основные функции; пришло время углубиться в CSS. В этом модуле рассматриваются каскады и наследование, все доступные типы селекторов, блоков, изменений размеров, фонов, границ, а также отладка и многое другое.

-

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

+

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

Необходимые умения

-

Перед изучением этого раздела Вы должны иметь:

+

Перед изучением этого раздела вы должны иметь:

  1. Стандартную рабочую среду (Установке базового программного обеспечения), а также понимание того, как создавать файлы и работать с ними (Работа с файлами).
    2. @@ -30,16 +30,16 @@ translation_of: Learn/CSS/Building_blocks
-

Примечание: Если Вы работаете на компьютере/планшете/другом устройстве, где нет возможности создавать файлы, Вы можете опробовать примеры (большую часть) на таких онлайн-программах, как JSBin или Thimble.

+

Примечание: Если вы работаете на компьютере/планшете/другом устройстве, где нет возможности создавать файлы, вы можете опробовать примеры (большую часть) на таких онлайн-программах, как JSBin или Thimble.

Руководства

-

В этом модуле содержатся следующие статьи, в которых рассказывается об основных составляющих языка. По мере обучения Вы встретите упражнения, позволяющие Вам усвоить пройденный материал.

+

В этом модуле содержатся следующие статьи, в которых рассказывается об основных составляющих языка. По мере обучения вы встретите упражнения, позволяющие вам усвоить пройденный материал.

Каскад и наследование
-
Цель данного урока — углубить Ваше понимание основных концепций CSS — каскадов, спецификаций и наследования, — которые контролируют, как CSS добавляется в HTML и как разрешаются конфликты.
+
Цель данного урока — углубить ваше понимание основных концепций CSS — каскадов, спецификаций и наследования, — которые контролируют, как CSS добавляется в HTML и как разрешаются конфликты.
CSS-селекторы
Существует широкий выбор CSS-селекторов, позволяющий максимально точно отбирать элементы для стилизации. В этой статье и её подстатьях мы рассмотрим разные типы в мельчайших подробностях и увидим как они работают. Подстатьи по порядку:
    @@ -50,9 +50,9 @@ translation_of: Learn/CSS/Building_blocks
Блоки в CSS
-
Всё в CSS имеет форму блока, и понимание блоков позволяет Вам размещать элементы с помощью CSS или согласовывать их друг с другом. В этом уроке мы как следует рассмотрим CSS-блоки.
+
Всё в CSS имеет форму блока, и понимание блоков позволяет вам размещать элементы с помощью CSS или согласовывать их друг с другом. В этом уроке мы как следует рассмотрим CSS-блоки.
Фон и границы
-
В этом уроке мы рассмотрим всякие интересные вещи, которые Вы можете делать благодаря CSS-фонам и границам, — от добавления градиентов и фоновых изображений до скругления углов, фонов и границ.
+
В этом уроке мы рассмотрим всякие интересные вещи, которые вы можете делать благодаря CSS-фонам и границам, — от добавления градиентов и фоновых изображений до скругления углов, фонов и границ.
Изменение направления текста
Раньше CSS развивался, чтобы лучше поддерживать разные режимы написания, включая справа налево или сверху вниз (как в японском языке). Мы рассмотрим их в этой статье.
Перекрытие содержимого
@@ -60,21 +60,21 @@ translation_of: Learn/CSS/Building_blocks
Значения свойств CSS
У каждого CSS-свойства есть значения. В этом уроке мы рассмотрим основные значения и их единицы.
Изменение размеров в CSS
-
В предыдущих уроках Вы встречались с различными способами изменения размеров элементов с использованием CSS. В этой статье мы собрали разные способы изменить размер через CSS.
+
В предыдущих уроках вы встречались с различными способами изменения размеров элементов с использованием CSS. В этой статье мы собрали разные способы изменить размер через CSS.
Элементы изображений, форм и медиа-элементы
-
Мы рассмотрим, как некоторые элементы относятся к CSS. Изображения, формы и другие медиа-элементы ведут себя по-другому, когда Вы стилизуете их через CSS. Некоторые функции могут не работать, поэтому в этой статье мы рассмотрим то, что Вам нужно знать про эти элементы.
+
Мы рассмотрим, как некоторые элементы относятся к CSS. Изображения, формы и другие медиа-элементы ведут себя по-другому, когда вы стилизуете их через CSS. Некоторые функции могут не работать, поэтому в этой статье мы рассмотрим то, что вам нужно знать про эти элементы.
Стилизация таблиц
Стилизация HTML таблиц — это не самая гламурная работа в мире, но иногда нам нужно это делать. Эта статья описывает, как сделать, чтобы Ваши HTML-таблицы выглядели хорошо, и некоторые свойства, подробно рассмотренные в предыдущих статьях.
Отладка CSS
-
При написании CSS Вы можете столкнуться с тем, что Ваш CSS-код работает не так, как Вы того хотели. Вы узнаете, как отлаживать CSS и как с помощью инструментов разработчика понять, где неполадка.
+
При написании CSS вы можете столкнуться с тем, что ваш CSS-код работает не так, как вы того хотели. Вы узнаете, как отлаживать CSS и как с помощью инструментов разработчика понять, где неполадка.
Организация CSS-кода
-
Как только Вы начнёте работать над большими проектами и таблицами стилей, Вы поймёте, что обслуживать такие таблицы не так-то и легко. В статье мы рассмотрим, как лучше писать CSS, чтобы его было легче обслуживать.
+
Как только вы начнёте работать над большими проектами и таблицами стилей, вы поймёте, что обслуживать такие таблицы не так-то и легко. В статье мы рассмотрим, как лучше писать CSS, чтобы его было легче обслуживать.

Смотрите также

Узконаправленные функции CSS
-
В этой статье описаны некоторые хитрости, которые познакомят Вас с такими узкоспециализированными свойствами, как box-shadow, режимы смешивания и фильтры.
+
В этой статье описаны некоторые хитрости, которые познакомят вас с такими узкоспециализированными свойствами, как box-shadow, режимы смешивания и фильтры.
diff --git a/files/ru/learn/css/building_blocks/selectors/index.html b/files/ru/learn/css/building_blocks/selectors/index.html index dc1eae6b95..242a0859fa 100644 --- a/files/ru/learn/css/building_blocks/selectors/index.html +++ b/files/ru/learn/css/building_blocks/selectors/index.html @@ -39,9 +39,9 @@ original_slug: Learn/CSS/Building_blocks/Селекторы

Some code with the h1 highlighted.

-

Ранее Вы встречали несколько разных селекторов и узнали, что существуют селекторы, которые по-разному относятся к документу, — например используя элемент h1 или класс .special.

+

Ранее вы встречали несколько разных селекторов и узнали, что существуют селекторы, которые по-разному относятся к документу, — например используя элемент h1 или класс .special.

-

В CSS селекторы определяются в спецификации CSS-селекторов; как и другие части CSS, нужно поддерживать их работу в браузерах. Большинство селекторов, которые Вы встретите, определены в Спецификации селекторов 3 уровня, где Вы сможете найти всю информацию о поддержке селекторов в браузерах.

+

В CSS селекторы определяются в спецификации CSS-селекторов; как и другие части CSS, нужно поддерживать их работу в браузерах. Большинство селекторов, которые вы встретите, определены в Спецификации селекторов 3 уровня, где вы сможете найти всю информацию о поддержке селекторов в браузерах.

Несколько селекторов

@@ -136,7 +136,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы

Продолжение

-

Ниже можно просмотреть таблицу различных видов селекторов с соответствующими ссылками, или Вы можете двинуться дальше: нас ждут селекторы тегов, классов и идентификаторов.

+

Ниже можно просмотреть таблицу различных видов селекторов с соответствующими ссылками, или вы можете двинуться дальше: нас ждут селекторы тегов, классов и идентификаторов.

{{PreviousMenuNext("Learn/CSS/Building_blocks/Cascade_and_inheritance", "Learn/CSS/Building_blocks/Selectors/Type_Class_and_ID_Selectors", "Learn/CSS/Building_blocks")}}

diff --git a/files/ru/learn/css/building_blocks/selectors/selectors_tasks/index.html b/files/ru/learn/css/building_blocks/selectors/selectors_tasks/index.html index 4375def5db..ce8f4424e0 100644 --- a/files/ru/learn/css/building_blocks/selectors/selectors_tasks/index.html +++ b/files/ru/learn/css/building_blocks/selectors/selectors_tasks/index.html @@ -14,7 +14,7 @@ original_slug: Learn/CSS/Building_blocks/Селекторы/Селекторы_

Цель этой задачи — помочь вам проверить ваше понимание селекторов в CSS.

-

Примечание: Вы можете проверять решения в интерактивном редакторе, расположенном ниже, но, возможно, вам будут полезны онлайн-инструменты, такие как  CodePen, jsFiddle или Glitch, которые можно использовать для работы над заданием, предварительно загрузив в них код.
+

Примечание: вы можете проверять решения в интерактивном редакторе, расположенном ниже, но, возможно, вам будут полезны онлайн-инструменты, такие как  CodePen, jsFiddle или Glitch, которые можно использовать для работы над заданием, предварительно загрузив в них код.

Если вы зашли в тупик, обратитесь к нам за помощью — смотрите раздел Оценка или дальнейшая помощь внизу этой страницы.

diff --git a/files/ru/learn/css/building_blocks/the_box_model/index.html b/files/ru/learn/css/building_blocks/the_box_model/index.html index 96ba3fb315..cadef38488 100644 --- a/files/ru/learn/css/building_blocks/the_box_model/index.html +++ b/files/ru/learn/css/building_blocks/the_box_model/index.html @@ -173,7 +173,7 @@ translation_of: Learn/CSS/Building_blocks/The_box_model

{{EmbedGHLiveSample("css-examples/learn/box-model/box-models.html", '100%', 1000)}} 

-

Примечание: Вы можете найти решение этой задачи здесь.

+

Примечание: вы можете найти решение этой задачи здесь.

Использование инструментов разработчика в браузере для просмотра блочных моделей

diff --git a/files/ru/learn/css/css_layout/flexbox/index.html b/files/ru/learn/css/css_layout/flexbox/index.html index 46e77bfe72..101646aea2 100644 --- a/files/ru/learn/css/css_layout/flexbox/index.html +++ b/files/ru/learn/css/css_layout/flexbox/index.html @@ -62,7 +62,7 @@ translation_of: Learn/CSS/CSS_layout/Flexbox

Так, всего одно объявление делает всё, что нам нужно — здорово, правда? Мы получили 3-х колоночный макет с колонками равных размеров по ширине и высоте. Это связано с тем, что значения по умолчанию, заданные для flex элементов (дочерние элементы flex контейнера), настроены для решения основных задач. Подробнее об этом позже.

-

Примечание: Вы также можете установить значение {{cssxref("display")}} inline-flex, если хотите расставить inline элементы как flex блоки.

+

Примечание: вы также можете установить значение {{cssxref("display")}} inline-flex, если хотите расставить inline элементы как flex блоки.

Внутри flex модели

@@ -90,7 +90,7 @@ translation_of: Learn/CSS/CSS_layout/Flexbox

Вы увидите, что элементы расположились в виде столбцов, также как было до того, как мы добавили CSS код. Прежде чем продолжать, удалите эту строчку из примера.

-

Примечание: Вы можете также располагать flex элементы в обратном направлении, используя значения row-reverse и column-reverse. Попробуйте их тоже!

+

Примечание: вы можете также располагать flex элементы в обратном направлении, используя значения row-reverse и column-reverse. Попробуйте их тоже!

Перенос строк

diff --git a/files/ru/learn/css/css_layout/grids/index.html b/files/ru/learn/css/css_layout/grids/index.html index 084dc2f654..cfdfcd3c83 100644 --- a/files/ru/learn/css/css_layout/grids/index.html +++ b/files/ru/learn/css/css_layout/grids/index.html @@ -259,7 +259,7 @@ body { .col.span12 { width: calc((6.25%*12) + (2.08333333%*11)); }
-

Примечание: Вы можете увидеть нашу законченную версию в файле liquid-grid-calc.html (также см. её в режиме реального времени).

+

Примечание: вы можете увидеть нашу законченную версию в файле liquid-grid-calc.html (также см. её в режиме реального времени).

diff --git a/files/ru/learn/css/css_layout/index.html b/files/ru/learn/css/css_layout/index.html index 1fce962206..3f0be53aca 100644 --- a/files/ru/learn/css/css_layout/index.html +++ b/files/ru/learn/css/css_layout/index.html @@ -43,7 +43,7 @@ translation_of: Learn/CSS/CSS_layout

Руководство

-

Эти разделы содержат инструкции по основным инструментам и методам вёрстки, доступным в CSS. На последнем уроке у Вас будет возможность оценить понимание пройденного материала посредством вёрстки веб-страницы.

+

Эти разделы содержат инструкции по основным инструментам и методам вёрстки, доступным в CSS. На последнем уроке у вас будет возможность оценить понимание пройденного материала посредством вёрстки веб-страницы.

Введение в CSS вёрстку
diff --git a/files/ru/learn/css/css_layout/positioning/index.html b/files/ru/learn/css/css_layout/positioning/index.html index e99182f446..13c7c1dafd 100644 --- a/files/ru/learn/css/css_layout/positioning/index.html +++ b/files/ru/learn/css/css_layout/positioning/index.html @@ -50,7 +50,7 @@ translation_of: Learn/CSS/CSS_layout/Positioning

И если вы сейчас сохраните и обновите, то вы не увидите никаких изменений, не считая обновлённого цвета фона 2-го параграфа. Это нормально, как мы и говорили ранее, статическое позиционирование является поведением по умолчанию!

-

Примечание: Вы можете посмотреть живой пример на данном этапе на 1_static-positioning.html (см. исходный код).

+

Примечание: вы можете посмотреть живой пример на данном этапе на 1_static-positioning.html (см. исходный код).

Относительное позиционирование

@@ -169,7 +169,7 @@ span {

Во-вторых, обратите внимание, что позиция элемента изменилась — это потому, что {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("left")}}, и {{cssxref("right")}} ведут себя по-другому с абсолютным позиционированием. Вместо того, чтобы позиционировать элемент на основе его относительного положения в обычном потоке макета документа, они определяют расстояние, на котором элемент должен находиться от каждой из сторон содержащего элемента. Поэтому в этом случае мы говорим, что абсолютно позиционированный элемент должен располагаться в 30px от верха "содержащего элемента" и 30px от левого края (В этом случае "содержащий элемент" является исходным содержащим блоком. См. раздел ниже для дополнительной информации).

-

Примечание: Вы можете использовать {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("left")}}, и {{cssxref("right")}} для изменения размера элемента если вам надо. Попробуйте установить top: 0; bottom: 0; left: 0; right: 0; и margin: 0; для вашего позиционируемого элемента и посмотрите, что произойдёт! Потом снова все верните...

+

Примечание: вы можете использовать {{cssxref("top")}}, {{cssxref("bottom")}}, {{cssxref("left")}}, и {{cssxref("right")}} для изменения размера элемента если вам надо. Попробуйте установить top: 0; bottom: 0; left: 0; right: 0; и margin: 0; для вашего позиционируемого элемента и посмотрите, что произойдёт! Потом снова все верните...

diff --git a/files/ru/learn/css/css_layout/responsive_design/index.html b/files/ru/learn/css/css_layout/responsive_design/index.html index 8552c0c8ee..62d427f5c5 100644 --- a/files/ru/learn/css/css_layout/responsive_design/index.html +++ b/files/ru/learn/css/css_layout/responsive_design/index.html @@ -134,7 +134,7 @@ original_slug: Learn/CSS/CSS_layout/Отзывчивый_дизайн
-

Примечание: Вы можете найти живой пример и исходный код этого примера на GitHub.

+

Примечание: вы можете найти живой пример и исходный код этого примера на GitHub.

Современные технологии макетов

diff --git a/files/ru/learn/css/first_steps/getting_started/index.html b/files/ru/learn/css/first_steps/getting_started/index.html index cad8d8ee51..ed393dddc5 100644 --- a/files/ru/learn/css/first_steps/getting_started/index.html +++ b/files/ru/learn/css/first_steps/getting_started/index.html @@ -62,12 +62,12 @@ translation_of: Learn/CSS/First_steps/Getting_started
-

Примечание: Если Вы читаете это на устройстве или в среде, где Вы не можете легко создавать файлы, не беспокойтесь — ниже представлены редакторы кода, чтобы вы могли написать код прямо здесь, на странице.

+

Примечание: Если вы читаете это на устройстве или в среде, где вы не можете легко создавать файлы, не беспокойтесь — ниже представлены редакторы кода, чтобы вы могли написать код прямо здесь, на странице.

Добавление CSS в наш документ

-

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

+

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

Создайте файл в той же папке, что и документ HTML, и сохраните его как styles.css. Расширение .css показывает, что это файл CSS.

@@ -75,19 +75,19 @@ translation_of: Learn/CSS/First_steps/Getting_started 
<link rel="stylesheet" href="styles.css">
-

Элемент {{htmlelement("link")}} сообщает браузеру, что у нас есть таблица стилей, используя атрибут rel, и местоположение этой таблицы стилей в качестве значения атрибута href. Вы можете проверить, работает ли CSS, добавив правило в styles.css. Используя Ваш редактор кода, добавьте следующее в ваш файл CSS:

+

Элемент {{htmlelement("link")}} сообщает браузеру, что у нас есть таблица стилей, используя атрибут rel, и местоположение этой таблицы стилей в качестве значения атрибута href. вы можете проверить, работает ли CSS, добавив правило в styles.css. Используя ваш редактор кода, добавьте следующее в ваш файл CSS:

h1 {
   color: red;
 }
-

Сохраните файлы HTML и CSS и перезагрузите страницу в веб-браузере. Заголовок первого уровня в верхней части документа теперь должен быть красным. Если это произойдёт, поздравляю — Вы успешно применили CSS к документу HTML. Если этого не произойдёт, внимательно проверьте, правильно ли Вы ввели всё.

+

Сохраните файлы HTML и CSS и перезагрузите страницу в веб-браузере. Заголовок первого уровня в верхней части документа теперь должен быть красным. Если это произойдёт, поздравляю — вы успешно применили CSS к документу HTML. Если этого не произойдёт, внимательно проверьте, правильно ли вы ввели всё.

-

Вы можете продолжить работу в styles.css локально, или Вы можете использовать наш интерактивный редактор ниже, чтобы продолжить этот урок. Интерактивный редактор действует так, как если бы CSS на первой панели был связан с документом HTML, как это было в нашем документе выше.

+

Вы можете продолжить работу в styles.css локально, или вы можете использовать наш интерактивный редактор ниже, чтобы продолжить этот урок. Интерактивный редактор действует так, как если бы CSS на первой панели был связан с документом HTML, как это было в нашем документе выше.

Стилизация HTML-элементов

-

Делая наш заголовок красным, мы уже продемонстрировали, что можем нацеливать и стилизовать элемент HTML. Мы делаем это путём нацеливания на элемент selector — это селектор, который напрямую соответствует имени элемента HTML. Чтобы нацелиться на все абзацы в документе, Вы должны использовать селектор p. Чтобы сделать все абзацы зелёными, Вы должны использовать:

+

Делая наш заголовок красным, мы уже продемонстрировали, что можем нацеливать и стилизовать элемент HTML. Мы делаем это путём нацеливания на элемент selector — это селектор, который напрямую соответствует имени элемента HTML. Чтобы нацелиться на все абзацы в документе, вы должны использовать селектор p. Чтобы сделать все абзацы зелёными, вы должны использовать:

p {
   color: green;
@@ -107,7 +107,7 @@ translation_of: Learn/CSS/First_steps/Getting_started
 
 
Когда мы смотрим на хорошо размеченный HTML-документ, даже такой простой, как наш пример, мы можем увидеть, как браузер делает HTML читаемым, добавив некоторые стили по умолчанию. Заголовки большие и жирные, в нашем списке есть маркеры. Это происходит потому, что в браузерах есть внутренние таблицы стилей, содержащие стили по умолчанию, которые по умолчанию применяются ко всем страницам; без них весь текст работал бы вместе, и мы должны были бы стилизовать всё с нуля. Все современные браузеры по умолчанию отображают HTML-контент практически одинаково.

 
-
Однако Вам часто захочется что-то другое, кроме выбора, сделанного браузером. Это можно сделать, просто выбрав элемент HTML, который вы хотите изменить, и используя правило CSS, чтобы изменить его внешний вид. Хорошим примером является наш <ul> — неупорядоченный список. Он добавляет маркеры, и если я решу, что я не хочу эти маркеры, я могу удалить их вот так:

+
Однако вам часто захочется что-то другое, кроме выбора, сделанного браузером. Это можно сделать, просто выбрав элемент HTML, который вы хотите изменить, и используя правило CSS, чтобы изменить его внешний вид. Хорошим примером является наш <ul> — неупорядоченный список. Он добавляет маркеры, и если я решу, что я не хочу эти маркеры, я могу удалить их вот так:

 
 
li {
   list-style-type: none;
@@ -115,13 +115,13 @@ translation_of: Learn/CSS/First_steps/Getting_started
 
 
Попробуйте добавить это в свой CSS сейчас.

 
-
Свойство list-style-type — это хорошее свойство, информацию о котором можно найти на MDN, чтобы увидеть, какие значения поддерживаются. Взгляните на страницу для list-style-type и Вы найдёте интерактивный пример в верхней части страницы, чтобы опробовать некоторые другие значения, затем все допустимые значения будут подробно описаны ниже.

+
Свойство list-style-type — это хорошее свойство, информацию о котором можно найти на MDN, чтобы увидеть, какие значения поддерживаются. Взгляните на страницу для list-style-type и вы найдёте интерактивный пример в верхней части страницы, чтобы опробовать некоторые другие значения, затем все допустимые значения будут подробно описаны ниже.

 
-
Глядя на эту страницу, вы обнаружите, что помимо удаления маркеров списка Вы можете изменить их — попробуйте изменить их на квадратные маркеры, используя значение square.

+
Глядя на эту страницу, вы обнаружите, что помимо удаления маркеров списка вы можете изменить их — попробуйте изменить их на квадратные маркеры, используя значение square.

 
 
Добавление класса

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

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

 
 
В своём HTML-документе добавьте Атрибут class ко второму пункту списка. Ваш список теперь будет выглядеть так:

 
@@ -131,7 +131,7 @@ translation_of: Learn/CSS/First_steps/Getting_started
   <li>Элемент <em>три</em></li>
 </ul>

 
-
В Вашем CSS Вы можете выбрать класс special к любому элементу на странице, чтобы он выглядел так же, как и этот элемент списка. Добавьте следующее в ваш файл CSS:

+
В вашем CSS вы можете выбрать класс special к любому элементу на странице, чтобы он выглядел так же, как и этот элемент списка. Добавьте следующее в ваш файл CSS:

 
 
.special {
   color: orange;
@@ -142,14 +142,14 @@ translation_of: Learn/CSS/First_steps/Getting_started
 
 
Вы можете захотеть, чтобы <span> в абзаце также был оранжевым и жирным. Попробуйте добавить класс "special", затем перезагрузите страницу и посмотрите, что получится.

 
-
Иногда Вы увидите правила с селектором, который перечисляет селектор HTML-элемента вместе с классом:

+
Иногда вы увидите правила с селектором, который перечисляет селектор HTML-элемента вместе с классом:

 
 
li.special {
   color: orange;
   font-weight: bold;
 }

 
-
Этот синтаксис означает «предназначаться для любого элемента li, который имеет класс special». Если бы Вы сделали это, Вы бы больше не смогли применить класс к <span> или другому элементу, просто добавив к нему класс; Вы должны добавить этот элемент в список селекторов:

+
Этот синтаксис означает «предназначаться для любого элемента li, который имеет класс special». Если бы вы сделали это, вы бы больше не смогли применить класс к <span> или другому элементу, просто добавив к нему класс; вы должны добавить этот элемент в список селекторов:

 
 
li.special,
 span.special {
@@ -157,11 +157,11 @@ span.special {
   font-weight: bold;
 }

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

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

 
 
Стилизация элементов на основе их расположения в документе

 
-
Есть моменты, когда Вы хотите, чтобы что-то выглядело иначе, в зависимости от того, где оно находится в документе. Здесь есть несколько селекторов, которые могут Вам помочь, но сейчас мы рассмотрим только пару. В нашем документе два элемента <em> — один внутри абзаца, а другой внутри элемента списка. Чтобы выбрать только <em> который вложен в элемент <li>, я могу использовать селектор под названием descendant combinator (комбинатор-потомок), который просто принимает форму пробела между двумя другими селекторами.

+
Есть моменты, когда вы хотите, чтобы что-то выглядело иначе, в зависимости от того, где оно находится в документе. Здесь есть несколько селекторов, которые могут вам помочь, но сейчас мы рассмотрим только пару. В нашем документе два элемента <em> — один внутри абзаца, а другой внутри элемента списка. Чтобы выбрать только <em> который вложен в элемент <li>, я могу использовать селектор под названием descendant combinator (комбинатор-потомок), который просто принимает форму пробела между двумя другими селекторами.

 
 
Добавьте следующее правило в таблицу стилей.

 
@@ -169,7 +169,7 @@ span.special {
   color: rebeccapurple;
 }

 
-
Этот селектор выберет любой элемент <em>, который находится внутри (потомка) <li>. Итак, в Вашем примере документа Вы должны найти, что <em> в третьем элементе списка теперь фиолетовый, но тот, который находится внутри абзаца, не изменился.

+
Этот селектор выберет любой элемент <em>, который находится внутри (потомка) <li>. Итак, в вашем примере документа вы должны найти, что <em> в третьем элементе списка теперь фиолетовый, но тот, который находится внутри абзаца, не изменился.

 
 
Ещё можно попробовать стилизовать абзац, когда он идёт сразу после заголовка на том же уровне иерархии в HTML. Для этого поместите +  (соседний братский комбинатор) между селекторами.

 
@@ -179,12 +179,12 @@ span.special {
   font-size: 200%;
 }
-

Пример ниже включает в себя два правила выше. Попробуйте добавить правило, чтобы сделать элемент span красный, если он внутри абзаца. Вы узнаете, правильно ли Вы это сделали, так как промежуток в первом абзаце будет красным, но цвет в первом элементе списка не изменит цвет.

+

Пример ниже включает в себя два правила выше. Попробуйте добавить правило, чтобы сделать элемент span красный, если он внутри абзаца. Вы узнаете, правильно ли вы это сделали, так как промежуток в первом абзаце будет красным, но цвет в первом элементе списка не изменит цвет.

{{EmbedGHLiveSample("css-examples/learn/getting-started/started2.html", '100%', 1100)}}

-

Примечание: Как Вы можете видеть, CSS даёт нам несколько способов нацеливания на элементы, и мы пока только слегка изучили его! Мы будем внимательно смотреть на все эти селекторы и многое другое в нашей статье Селекторы позже в нашем курсе.

+

Примечание: Как вы можете видеть, CSS даёт нам несколько способов нацеливания на элементы, и мы пока только слегка изучили его! Мы будем внимательно смотреть на все эти селекторы и многое другое в нашей статье Селекторы позже в нашем курсе.

Стилизация элементов на основе состояния

@@ -205,23 +205,23 @@ a:visited { text-decoration: none; } -

В приведённом ниже примере Вы можете поиграть с разными значениями для разных состояний ссылки. Я добавил к нему правила, приведённые выше, и теперь понимаю, что розовый цвет довольно лёгкий и трудно читаемый — почему бы не изменить его на лучший цвет? Можете ли Вы сделать ссылки жирным шрифтом?

+

В приведённом ниже примере вы можете поиграть с разными значениями для разных состояний ссылки. Я добавил к нему правила, приведённые выше, и теперь понимаю, что розовый цвет довольно лёгкий и трудно читаемый — почему бы не изменить его на лучший цвет? Можете ли вы сделать ссылки жирным шрифтом?

{{EmbedGHLiveSample("css-examples/learn/getting-started/started3.html", '100%', 900)}} 

-

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

+

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

-

Примечание:  Вы часто будете видеть упоминание о доступности в этих уроках и по всей MDN. Когда мы говорим о доступности, мы имеем в виду требование, чтобы наши веб-страницы были понятными и доступными для всех.

+

Примечание:  вы часто будете видеть упоминание о доступности в этих уроках и по всей MDN. Когда мы говорим о доступности, мы имеем в виду требование, чтобы наши веб-страницы были понятными и доступными для всех.

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

-

Простой HTML-документ, как правило, доступен каждому — когда Вы начинаете оформлять этот документ, важно, чтобы Вы не сделали его менее доступным.

+

Простой HTML-документ, как правило, доступен каждому — когда вы начинаете оформлять этот документ, важно, чтобы вы не сделали его менее доступным.

Сочетание селекторов и комбинаторов

-

Стоит отметить, что Вы можете комбинировать несколько селекторов и комбинаторов вместе. Вот пример:

+

Стоит отметить, что вы можете комбинировать несколько селекторов и комбинаторов вместе. Вот пример:

/* выбирает любой <span> внутри <p>, который находится внутри <article>  */
 article p span { ... }
@@ -241,11 +241,11 @@ h1 + ul + p { ... }

В оригинальном HTML, который мы предоставили, единственный элемент в стиле <span class="special">.

-

Не беспокойтесь, если это покажется сложным — Вы скоро начнёте понимать это, когда будете писать больше на CSS.

+

Не беспокойтесь, если это покажется сложным — вы скоро начнёте понимать это, когда будете писать больше на CSS.

Завершение

-

В этом уроке мы рассмотрели несколько способов стилизации документа с использованием CSS. Мы будем развивать эти знания по мере прохождения остальных уроков. Однако Вы уже знаете достаточно, чтобы стилизовать текст, применять CSS на основе различных способов нацеливания на элементы в документе и искать свойства и значения в документации MDN.

+

В этом уроке мы рассмотрели несколько способов стилизации документа с использованием CSS. Мы будем развивать эти знания по мере прохождения остальных уроков. Однако вы уже знаете достаточно, чтобы стилизовать текст, применять CSS на основе различных способов нацеливания на элементы в документе и искать свойства и значения в документации MDN.

На следующем уроке мы рассмотрим структуру CSS.

diff --git a/files/ru/learn/css/first_steps/how_css_is_structured/index.html b/files/ru/learn/css/first_steps/how_css_is_structured/index.html index 3956b38eec..de6232bf67 100644 --- a/files/ru/learn/css/first_steps/how_css_is_structured/index.html +++ b/files/ru/learn/css/first_steps/how_css_is_structured/index.html @@ -188,7 +188,7 @@ h1, h2, .intro /* перечисление селекторов */
-

Примечание: Вы узнаете больше о селекторах в руководстве CSS-селекторы в следующем модуле.

+

Примечание: вы узнаете больше о селекторах в руководстве CSS-селекторы в следующем модуле.

Спецификация

diff --git a/files/ru/learn/css/first_steps/how_css_works/index.html b/files/ru/learn/css/first_steps/how_css_works/index.html index 3dacedb68c..661ae128e0 100644 --- a/files/ru/learn/css/first_steps/how_css_works/index.html +++ b/files/ru/learn/css/first_steps/how_css_works/index.html @@ -51,7 +51,7 @@ translation_of: Learn/CSS/First_steps/How_CSS_works

DOM напоминает дерево. Каждый элемент, атрибут, отрывок текста становится {{Glossary("Node/DOM","DOM node")}} в разметке. DOM-узлы определяются их отношением с другими узлами. Некоторые родительские элементы имеют дочерние, а у дочерних элементов есть братские.

-

Понимание DOM позволит вам разрабатывать, отлаживать и поддерживать ваш CSS, потому что именно в DOM-дереве Ваши таблицы стилей и код встречаются. Когда вы начнёте работать с браузерным DevTools(инструменты для разработки) вы будете перемещаться по DOM при выборе элементов чтобы увидеть какие правила применяются.

+

Понимание DOM позволит вам разрабатывать, отлаживать и поддерживать ваш CSS, потому что именно в DOM-дереве ваши таблицы стилей и код встречаются. Когда вы начнёте работать с браузерным DevTools(инструменты для разработки) вы будете перемещаться по DOM при выборе элементов чтобы увидеть какие правила применяются.

Как представлено DOM-дерево

@@ -115,11 +115,11 @@ translation_of: Learn/CSS/First_steps/How_CSS_works

Что происходит, когда браузер не понимает CSS?

-

В предыдущем уроке я упомянул, что некоторые браузеры могут не поддерживать новые функции CSS. Вдобавок не все используют новейшие версии браузеров. Зная, что CSS разрабатывается всё время, Вы можете поразиться и крайне ужаснуться тому, что происходит, если браузер не распознаёт объявление или селектор. Что же произойдёт?

+

В предыдущем уроке я упомянул, что некоторые браузеры могут не поддерживать новые функции CSS. Вдобавок не все используют новейшие версии браузеров. Зная, что CSS разрабатывается всё время, вы можете поразиться и крайне ужаснуться тому, что происходит, если браузер не распознаёт объявление или селектор. Что же произойдёт?

— Да ничего: браузер просто пропустит это!

-

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

+

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

Если же браузер встретит селектор, который он не распознаёт, то он просто пропустит данное правило и двинется дальше.

@@ -137,9 +137,9 @@ translation_of: Learn/CSS/First_steps/How_CSS_works

{{EmbedLiveSample('Skipping_example', '100%', 200)}}

-

Такое поведение можно использовать, например, при добавлении новых функций CSS в качестве дополнения, причём Вы будете уверены, что ничего не сломается, если браузер не распознает элемент. Вы можете использовать два правила с одинаковыми уровнями спецификации: одно — в качестве альтернативы для случая, если браузер не поддерживает нововведение.

+

Такое поведение можно использовать, например, при добавлении новых функций CSS в качестве дополнения, причём вы будете уверены, что ничего не сломается, если браузер не распознает элемент. Вы можете использовать два правила с одинаковыми уровнями спецификации: одно — в качестве альтернативы для случая, если браузер не поддерживает нововведение.

-

Это хорошо применяется, если Вы хотите использовать величину, не использующуюся везде в документе. К примеру, некоторые старые браузеры не поддерживают calc() как значение. Я добавлю резерв — значение в px, затем задам ширину с помощью функции calc(), равной 100% - 50px. Старые браузеры используют пиксельное значение, потому что не распознают calc(). Новые браузеры используют calc() так как эта строка появляется позже в каскаде.

+

Это хорошо применяется, если вы хотите использовать величину, не использующуюся везде в документе. К примеру, некоторые старые браузеры не поддерживают calc() как значение. Я добавлю резерв — значение в px, затем задам ширину с помощью функции calc(), равной 100% - 50px. Старые браузеры используют пиксельное значение, потому что не распознают calc(). Новые браузеры используют calc() так как эта строка появляется позже в каскаде.

.box {
   width: 500px;
@@ -148,7 +148,7 @@ translation_of: Learn/CSS/First_steps/How_CSS_works
 
 
Завершение

 
-
Вы почти закончили модуль; осталось только одно. В следующей статье Вы попрактикуетесь в использовании ваших новых знаний.

+
Вы почти закончили модуль; осталось только одно. В следующей статье вы попрактикуетесь в использовании ваших новых знаний.

 
 
{{PreviousMenuNext("Learn/CSS/First_steps/How_CSS_is_structured", "Learn/CSS/First_steps/Using_your_new_knowledge", "Learn/CSS/First_steps")}}

 
diff --git a/files/ru/learn/css/first_steps/index.html b/files/ru/learn/css/first_steps/index.html
index af481bea5e..8439130ac9 100644
--- a/files/ru/learn/css/first_steps/index.html
+++ b/files/ru/learn/css/first_steps/index.html
@@ -39,7 +39,7 @@ translation_of: Learn/CSS/First_steps
  
Начало работы с CSS

  
В этой статье мы возьмём простой HTML-документ и применим к нему CSS, изучая некоторые практические вещи о языке.

  
Как структурирован CSS

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

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

  
Как работает CSS

  
Мы изучили основы CSS — для чего он нужен и как писать простые таблицы стилей. В этом уроке мы рассмотрим, как браузер берёт CSS и HTML и превращает их в веб-страницу.

  
Использование ваших новых знаний

diff --git a/files/ru/learn/css/first_steps/using_your_new_knowledge/index.html b/files/ru/learn/css/first_steps/using_your_new_knowledge/index.html
index 41873a7a60..a330376ca0 100644
--- a/files/ru/learn/css/first_steps/using_your_new_knowledge/index.html
+++ b/files/ru/learn/css/first_steps/using_your_new_knowledge/index.html
@@ -62,7 +62,7 @@ translation_of: Learn/CSS/First_steps/Using_your_new_knowledge
  
  • Сделайте ссылки зелёными при наведении.
    • 
 
 
-
    У Вас должно получиться примерно как-то так:
    
+
    У вас должно получиться примерно как-то так:
    
 
 
    Screenshot of how the example should look after completing the assessment.
    
 
@@ -74,23 +74,23 @@ translation_of: Learn/CSS/First_steps/Using_your_new_knowledge
 
 
    Помощь
    
 
-
    Если Вы хотите, чтобы вашу работу оценили, или вы не справляетесь, и вам нужна помощь:
    
+
    Если вы хотите, чтобы вашу работу оценили, или вы не справляетесь, и вам нужна помощь:
    
 
 
      
- 
    1. Загрузите Ваш код на CodePen, jsFiddle или Glitch.
      2. 
- 
    2. Напишите пост с просьбой о помощи и / или оценке на форуме MDN. Добавьте тег "learning" к вашему посту, чтобы нам легче было его найти. В Вашем посте должны быть:
+ 
    3. Загрузите ваш код на CodePen, jsFiddle или Glitch.
      4. 
+ 
    4. Напишите пост с просьбой о помощи и / или оценке на форуме MDN. Добавьте тег "learning" к вашему посту, чтобы нам легче было его найти. В вашем посте должны быть:
   
        
    
      • Заголовок с описанием наподобие "Assessment wanted for CSS First Steps".
        • 
-   
      • Описание того, что Вам нужно, — к примеру, что Вы уже пробовали, что у Вас не получается и Вам нужна помощь.
        • 
+   
      • Описание того, что вам нужно, — к примеру, что вы уже пробовали, что у вас не получается и вам нужна помощь.
        • 
    
      • Ссылка на ваш код в онлайн-редакторе.
        • 
-   
      • Ссылка на страницу о помощи, чтобы мы смогли помочь Вам с вашим вопросом.
        • 
+   
      • Ссылка на страницу о помощи, чтобы мы смогли помочь вам с вашим вопросом.
        • 
   
      
  
      5. 
 
    
 
 
    Что дальше?
    
 
-
    Поздравляем Вас с завершением первого модуля! Теперь Вы неплохо разбираетесь в CSS и можете разобраться в таблицах стилей. В следующем модуле, Как устроен CSS, мы глубже разберёмся в некоторых аспектах языка.
    
+
    Поздравляем вас с завершением первого модуля! Теперь вы неплохо разбираетесь в CSS и можете разобраться в таблицах стилей. В следующем модуле, Как устроен CSS, мы глубже разберёмся в некоторых аспектах языка.
    
 
 
    {{PreviousMenu("Learn/CSS/First_steps/How_CSS_works", "Learn/CSS/First_steps")}}
    
 
diff --git a/files/ru/learn/css/first_steps/what_is_css/index.html b/files/ru/learn/css/first_steps/what_is_css/index.html
index d2dc14cce2..7ce81dc6b5 100644
--- a/files/ru/learn/css/first_steps/what_is_css/index.html
+++ b/files/ru/learn/css/first_steps/what_is_css/index.html
@@ -32,19 +32,19 @@ original_slug: Learn/CSS/First_steps/Что_такое_CSS
    -

    В модуле Основы HTML мы рассмотрели, что такое HTML и как он используется для разметки документов. Эти документы будут доступны для чтения в веб-браузере. Заголовки будут выглядеть больше, чем обычный текст, абзацы разбиваются на новую строку и будут иметь пространство между друг другом. Ссылки выделены цветом и подчёркнуты, чтобы отличить их от остального текста. То, что Вы видите, — это стили браузера по умолчанию — самые основные стили, которые браузер применяет к HTML, чтобы гарантировать, что он будет в основном читабельным, даже если автор страницы не указал явный стиль.

    +

    В модуле Основы HTML мы рассмотрели, что такое HTML и как он используется для разметки документов. Эти документы будут доступны для чтения в веб-браузере. Заголовки будут выглядеть больше, чем обычный текст, абзацы разбиваются на новую строку и будут иметь пространство между друг другом. Ссылки выделены цветом и подчёркнуты, чтобы отличить их от остального текста. То, что вы видите, — это стили браузера по умолчанию — самые основные стили, которые браузер применяет к HTML, чтобы гарантировать, что он будет в основном читабельным, даже если автор страницы не указал явный стиль.

    -

    Тем не менее, интернет был бы скучным, если бы все сайты выглядели так. Используя CSS, Вы можете до мелочей контролировать, как элементы HTML выглядят в браузере, представляя вашу разметку, используя любой понравившийся Вам дизайн.

    +

    Тем не менее, интернет был бы скучным, если бы все сайты выглядели так. Используя CSS, вы можете до мелочей контролировать, как элементы HTML выглядят в браузере, представляя вашу разметку, используя любой понравившийся вам дизайн.

    Для чего нужен CSS?

    Как мы уже упоминали ранее, CSS — это язык для определения того, как документы представляются пользователям — как они оформляются, размещаются и т. д.

    -

    Документ обычно представляет собой текстовый файл, структурированный с использованием языка разметки: {{Glossary("HTML")}} — самый распространённый язык разметки, но Вы также можете встретить другие языки разметки, такие как {{Glossary("SVG")}} или {{Glossary("XML")}}.

    +

    Документ обычно представляет собой текстовый файл, структурированный с использованием языка разметки: {{Glossary("HTML")}} — самый распространённый язык разметки, но вы также можете встретить другие языки разметки, такие как {{Glossary("SVG")}} или {{Glossary("XML")}}.

    -

    Представление документа пользователю означает преобразование его в форму, используемую Вашей аудиторией. {{Glossary("browser","Browsers")}}, такие как {{Glossary("Mozilla Firefox","Firefox")}}, {{Glossary("Google Chrome","Chrome")}} или {{Glossary("Microsoft Edge","Edge")}} , предназначены для визуального представления документов, например, на экране компьютера, проектора или принтера.

    +

    Представление документа пользователю означает преобразование его в форму, используемую вашей аудиторией. {{Glossary("browser","Browsers")}}, такие как {{Glossary("Mozilla Firefox","Firefox")}}, {{Glossary("Google Chrome","Chrome")}} или {{Glossary("Microsoft Edge","Edge")}} , предназначены для визуального представления документов, например, на экране компьютера, проектора или принтера.

    Примечание: Браузер иногда называют {{Glossary("User agent","user agent")}}, что в основном означает компьютерную программу, которая представляет человека внутри компьютерной системы. Браузеры — это основной тип пользовательского агента, о котором мы думаем, когда говорим о CSS, но он не единственный. Доступны и другие пользовательские агенты, например, те, которые преобразуют документы HTML и CSS в файлы PDF для печати.

    @@ -54,7 +54,7 @@ original_slug: Learn/CSS/First_steps/Что_такое_CSS

    Синтаксис CSS

    -

    CSS — это язык на основе правил: Вы задаёте правила, определяющие группы стилей, которые должны применяться к определённым элементам или группам элементов на Вашей веб-странице. Например:

    +

    CSS — это язык на основе правил: вы задаёте правила, определяющие группы стилей, которые должны применяться к определённым элементам или группам элементов на вашей веб-странице. Например:

    «Я хочу, чтобы основной заголовок на моей странице отображался крупным красным текстом».

    @@ -82,19 +82,19 @@ p { color: black; } -

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

    +

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

    -

    Примечание: Вы можете найти ссылки на все страницы свойств CSS (вместе с другими функциями CSS), перечисленные в MDN Руководстве по CSS. Кроме того, Вы должны привыкнуть к поиску "MDN css-feature-name" в Вашем браузере, когда Вам нужно узнать больше информации о функции CSS. Например, попробуйте поискать «mdn color» и «mdn font-size»!

    +

    Примечание: вы можете найти ссылки на все страницы свойств CSS (вместе с другими функциями CSS), перечисленные в MDN Руководстве по CSS. Кроме того, вы должны привыкнуть к поиску "MDN css-feature-name" в вашем браузере, когда вам нужно узнать больше информации о функции CSS. Например, попробуйте поискать «mdn color» и «mdn font-size»!

    CSS-модули

    -

    Поскольку существует множество вещей, которые можно стилизовать с помощью CSS, язык разбит на модули. По мере изучения MDN Вы увидите ссылки на эти модули, а многие страницы документации организованы вокруг определённого модуля. Например, вы можете взглянуть на ссылку MDN в модуле Свойства фона и границ, чтобы узнать, какова его цель и какие различные свойства и другие функции он содержит. Вы также найдёте ссылки на спецификацию CSS, которая определяет технологию (см. ниже).

    +

    Поскольку существует множество вещей, которые можно стилизовать с помощью CSS, язык разбит на модули. По мере изучения MDN вы увидите ссылки на эти модули, а многие страницы документации организованы вокруг определённого модуля. Например, вы можете взглянуть на ссылку MDN в модуле Свойства фона и границ, чтобы узнать, какова его цель и какие различные свойства и другие функции он содержит. Вы также найдёте ссылки на спецификацию CSS, которая определяет технологию (см. ниже).

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

    -

    Для конкретного примера давайте вернёмся к модулю Свойства фона и границ — Вы можете подумать, что это логично для свойств background-color и border-color, которые будут определены в этом модуле. И Вы правы.

    +

    Для конкретного примера давайте вернёмся к модулю Свойства фона и границ — вы можете подумать, что это логично для свойств background-color и border-color, которые будут определены в этом модуле. И Вы правы.

    Технические характеристики CSS

    @@ -104,11 +104,11 @@ p {

    Новые функции CSS разрабатываются или определяются рабочей группой CSS. Иногда потому, что конкретный браузер заинтересован в том, чтобы иметь какие-то возможности, иногда потому, что веб-дизайнеры и разработчики запрашивают функцию, а иногда потому, что сама рабочая группа определила требование. CSS постоянно развивается, появляются новые функции. Тем не менее, ключевым моментом в CSS является то, что все работают очень усердно, чтобы никогда не менять вещи таким образом, чтобы это сломало старые сайты. Веб-сайт, созданный в 2000 году, с использованием ограниченного CSS, доступного в то время, должен всё ещё использоваться в браузере сегодня!

    -

    Как новичок в CSS, вполне вероятно, что Вы найдёте CSS-спецификации ошеломляющими — они предназначены для инженеров, чтобы использовать их для реализации поддержки функций в пользовательских агентах, а не для веб-разработчиков, чтобы читать, чтобы понимать CSS. Многие опытные разработчики предпочитают обращаться к документации MDN или другим учебникам. Однако стоит знать, что они существуют, понимать взаимосвязь между используемым CSS, поддержкой браузера (см. ниже) и спецификациями.

    +

    Как новичок в CSS, вполне вероятно, что вы найдёте CSS-спецификации ошеломляющими — они предназначены для инженеров, чтобы использовать их для реализации поддержки функций в пользовательских агентах, а не для веб-разработчиков, чтобы читать, чтобы понимать CSS. Многие опытные разработчики предпочитают обращаться к документации MDN или другим учебникам. Однако стоит знать, что они существуют, понимать взаимосвязь между используемым CSS, поддержкой браузера (см. ниже) и спецификациями.

    Поддержка браузера

    -

    После того как CSS был указан, он будет полезен для разработки веб-страниц, только если один или несколько браузеров его реализовали. Это означает, что код был написан для превращения инструкции в нашем CSS-файле во что-то, что может быть выведено на экран. Мы рассмотрим этот процесс подробнее на уроке Как работает CSS. Это необычно для всех браузеров, чтобы реализовать функцию одновременно, и поэтому обычно есть пробел, где вы можете использовать некоторую часть CSS в одних браузерах, а не в других. По этой причине полезно проверять состояние реализации. На каждой странице свойств в MDN Вы можете видеть статус интересующего Вас свойства, чтобы Вы могли определить, сможете ли Вы использовать её на веб-сайте.

    +

    После того как CSS был указан, он будет полезен для разработки веб-страниц, только если один или несколько браузеров его реализовали. Это означает, что код был написан для превращения инструкции в нашем CSS-файле во что-то, что может быть выведено на экран. Мы рассмотрим этот процесс подробнее на уроке Как работает CSS. Это необычно для всех браузеров, чтобы реализовать функцию одновременно, и поэтому обычно есть пробел, где вы можете использовать некоторую часть CSS в одних браузерах, а не в других. По этой причине полезно проверять состояние реализации. На каждой странице свойств в MDN вы можете видеть статус интересующего вас свойства, чтобы вы могли определить, сможете ли вы использовать её на веб-сайте.

    Ниже приведена диаграмма данных для CSS свойства font-family:

    @@ -116,7 +116,7 @@ p {

    Что дальше?

    -

    Теперь, когда у вас есть некоторое представление о том, что такое CSS, давайте перейдём к Началу работы с CSS, где Вы можете начать писать CSS самостоятельно.

    +

    Теперь, когда у вас есть некоторое представление о том, что такое CSS, давайте перейдём к Началу работы с CSS, где вы можете начать писать CSS самостоятельно.

    {{NextMenu("Learn/CSS/First_steps/Getting_started", "Learn/CSS/First_steps")}}

    diff --git a/files/ru/learn/css/index.html b/files/ru/learn/css/index.html index f0ac78f21b..b88d38c409 100644 --- a/files/ru/learn/css/index.html +++ b/files/ru/learn/css/index.html @@ -18,7 +18,7 @@ translation_of: Learn/CSS

    План обучения 

    -

    Прежде чем браться за CSS, Вам стоит разобраться с основами HTML. Мы рекомендуем изучить модуль Введение в HTML. После его прохождения переходите к:

    +

    Прежде чем браться за CSS, вам стоит разобраться с основами HTML. Мы рекомендуем изучить модуль Введение в HTML. После его прохождения переходите к:

    • изучению CSS, начиная с модуля Введение в CSS;
      • @@ -30,7 +30,7 @@ translation_of: Learn/CSS

      В данном разделе содержится информация, которая требует самой базовой ознакомленности с компьютером и интернетом. В статье Установка рабочего пространства подробно описано необходимое ПО и способы его установки, необходимо также будет уметь создавать и управлять файлами, в чём поможет статья Работа с файлами, которая включена в полное руководство для новичка Основы веб.

      -

      Перед тем как начинать данный раздел, мы рекомендуем пройти руководство Основы веб, хотя это вовсе не обязательно; большая часть того, что Вы найдёте в статье об основах CSS также встречается в разделе Введение в CSS, хотя и более детально.

      +

      Перед тем как начинать данный раздел, мы рекомендуем пройти руководство Основы веб, хотя это вовсе не обязательно; большая часть того, что вы найдёте в статье об основах CSS также встречается в разделе Введение в CSS, хотя и более детально.

      Модули

      @@ -38,7 +38,7 @@ translation_of: Learn/CSS
      Введение в CSS
      -
      CSS (каскадные таблицы стилей) используется для стилизации и компоновки веб-страниц, — например, для изменения шрифта, цвета, размера и интервала содержимого, разделения его на несколько столбцов или добавления анимации и других декоративных элементов. Этот модуль обеспечивает хорошее начало Вашего пути к освоению CSS с основами того, как он работает, как выглядит синтаксис и как Вы можете начать использовать его для добавления стилей в HTML.
      +
      CSS (каскадные таблицы стилей) используется для стилизации и компоновки веб-страниц, — например, для изменения шрифта, цвета, размера и интервала содержимого, разделения его на несколько столбцов или добавления анимации и других декоративных элементов. Этот модуль обеспечивает хорошее начало вашего пути к освоению CSS с основами того, как он работает, как выглядит синтаксис и как вы можете начать использовать его для добавления стилей в HTML.
      Дизайн текста
      Здесь мы рассмотрим основы стилизации текста, в том числе изменение шрифта, жирности, курсивного написания, межстрочного и межбуквенного интервалов, теней и других особенностей текста. Завершается модуль демонстрацией применения пользовательских шрифтов на вашей странице, оформлением списков и ссылок.
      Стилизация блоков
      @@ -53,7 +53,7 @@ translation_of: Learn/CSS

      В разделе Использование CSS для решения общих проблем даны ссылки на разделы, объясняющие, как следует использовать CSS для решения самых распространённых проблем при создании веб-страницы.

      -

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

      +

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

      Смотрите также

      @@ -61,5 +61,5 @@ translation_of: Learn/CSS
      CSS на MDN
      Основная точка входа для CSS документации на MDN с подробными ссылками на дополнительные учебники.
      CSS-справочник
      -
      Комплексный справочник по всем многочисленным особенностям языка CSS, — если Вы, к примеру, хотите знать, какие значения может иметь свойство, то Вам сюда.
      +
      Комплексный справочник по всем многочисленным особенностям языка CSS, — если Вы, к примеру, хотите знать, какие значения может иметь свойство, то вам сюда.
      diff --git a/files/ru/learn/css/styling_text/styling_links/index.html b/files/ru/learn/css/styling_text/styling_links/index.html index 710a785e66..5d66f90825 100644 --- a/files/ru/learn/css/styling_text/styling_links/index.html +++ b/files/ru/learn/css/styling_text/styling_links/index.html @@ -79,7 +79,7 @@ translation_of: Learn/CSS/Styling_text/Styling_links
    -

    Обратите внимание: Вы не ограничены только перечисленными выше свойствами чтобы стилизовать ссылки — вы можете использовать любые свойства, которые вам нравятся. Просто постарайтесь не сходить с ума слишком сильно!

    +

    Обратите внимание: вы не ограничены только перечисленными выше свойствами чтобы стилизовать ссылки — вы можете использовать любые свойства, которые вам нравятся. Просто постарайтесь не сходить с ума слишком сильно!

    Стилизация некоторых ссылок

    @@ -410,7 +410,7 @@ a:active {
    -

    Обратите внимание: Вы могли заметить что элементы списка в HTML все находятся на одной строке друг с другом — так сделано потому, что это сделано потому, что пробелы/разрывы строк между элементами встроенного блока создают пробелы на странице, точно также как пробелы между словами и такие пробелы могли бы нарушить расположение нашего горизонтального меню навигации. Вы можете найти больше информации об этой проблеме (и решения) на Fighting the space between inline block elements.

    +

    Обратите внимание: вы могли заметить что элементы списка в HTML все находятся на одной строке друг с другом — так сделано потому, что это сделано потому, что пробелы/разрывы строк между элементами встроенного блока создают пробелы на странице, точно также как пробелы между словами и такие пробелы могли бы нарушить расположение нашего горизонтального меню навигации. Вы можете найти больше информации об этой проблеме (и решения) на Fighting the space between inline block elements.

    Заключение

    diff --git a/files/ru/learn/css/styling_text/web_fonts/index.html b/files/ru/learn/css/styling_text/web_fonts/index.html index 96b48d3f60..96223649fe 100644 --- a/files/ru/learn/css/styling_text/web_fonts/index.html +++ b/files/ru/learn/css/styling_text/web_fonts/index.html @@ -148,7 +148,7 @@ original_slug: Learn/CSS/Styling_text/Веб_шрифты
    -

    Обратите внимание: Вы можете найти законченные версии google-font.html и google-font.css, если вам необходимо сверить вашу работу с нашей (см. live).

    +

    Обратите внимание: вы можете найти законченные версии google-font.html и google-font.css, если вам необходимо сверить вашу работу с нашей (см. live).

    @font-face более детально

    @@ -176,7 +176,7 @@ original_slug: Learn/CSS/Styling_text/Веб_шрифты
    -

    Обратите внимание: Вы также можете указать определённые значения {{cssxref("font-variant")}} и {{cssxref("font-stretch")}} для ваших веб-шрифтов. В новых браузерах вы также можете указать значение {{cssxref("unicode-range")}}, который является конкретным диапазоном символов, которые вы хотите использовать из веб-шрифта — в поддерживающих браузерах, будут загружены только указанные символы, сохраняя от ненужной загрузки. Creating Custom Font Stacks with Unicode-Range от Drew McLellan предоставляет некоторые полезные идеи того как это использовать

    +

    Обратите внимание: вы также можете указать определённые значения {{cssxref("font-variant")}} и {{cssxref("font-stretch")}} для ваших веб-шрифтов. В новых браузерах вы также можете указать значение {{cssxref("unicode-range")}}, который является конкретным диапазоном символов, которые вы хотите использовать из веб-шрифта — в поддерживающих браузерах, будут загружены только указанные символы, сохраняя от ненужной загрузки. Creating Custom Font Stacks with Unicode-Range от Drew McLellan предоставляет некоторые полезные идеи того как это использовать

    Переменные шрифты

    -- cgit v1.2.3-54-g00ecf