From c058fa0fb22dc40ef0225b21a97578cddd0aaffa Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:51:05 +0100 Subject: unslug ru: move --- .../css/css_layout/position_skills/index.html | 64 ++++++++++++++++++++++ 1 file changed, 64 insertions(+) create mode 100644 files/ru/learn/css/css_layout/position_skills/index.html (limited to 'files/ru/learn/css/css_layout/position_skills/index.html') diff --git a/files/ru/learn/css/css_layout/position_skills/index.html b/files/ru/learn/css/css_layout/position_skills/index.html new file mode 100644 index 0000000000..f63a3a3a94 --- /dev/null +++ b/files/ru/learn/css/css_layout/position_skills/index.html @@ -0,0 +1,64 @@ +--- +title: 'Проверьте свои навыки: позиционирование' +slug: Learn/CSS/CSS_layout/Навыки_позиционирования +translation_of: Learn/CSS/CSS_layout/Position_skills +--- +
{{LearnSidebar}}
+ +
+ +

Цель этого задания - чтобы вы поработали с CSS свойством {{CSSxRef("position")}} и его значениями которые описаны в нашем уроке Позиционирование. Вы будете работать над двумя небольшими задачами, использующими различные элементы из пройденного материала.

+ +
+

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

+ +

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

+
+ +

Позиционирование Раз

+ +

В этом задании вам необходимо расположить элементы с классом target в верхнем правом углу контейнера, который имеет серую границу 5px.

+ +

The green box is at the top right of a container with a grey border.

+ +

Попробуйте обновить живой код ниже для воссоздания законченного примера:

+ +

{{EmbedGHLiveSample("css-examples/learn/tasks/position/position1.html", '100%', 1000)}}

+ +

В качестве дополнительной задачи, сможете ли вы изменить цель так чтоб она отображалась под текстом?

+ +
+

Для оценки или дальнейшей работы, загрузите отправную точку этого задания чтобы работать в вашем собственном или онлайн редакторе

+
+ +

Позиционирование Два

+ +

В примере ниже если вы прокрутите блок боковая панель прокручивается вместе с контентом. Измените его так чтобы боковая панель оставалась на месте и прокручивался только контент.

+ +

The content is scrolled but the sidebar has stayed in place.

+ +

Попробуйте обновить живой код ниже для воссоздания законченного примера:

+ +

{{EmbedGHLiveSample("css-examples/learn/tasks/position/position2.html", '100%', 1000)}}

+ +
+

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

+
+ +

Оценка и дальнейшая помощь

+ +

Вы можете попрактиковаться с этими примерами в интерактивных редакторах упомянутых выше.

+ +

Если вы хотите, чтобы вашу работу оценили, или вы застряли и хотите попросить помощи:

+ +
    +
  1. Разместите свою работу в онлайн редакторе в которым можно поделиться работами в таком как CodePen, jsFiddle, или Glitch. Вы можете написать код самостоятельно или использовать файлы с отправными точками ссылки на которые имеются в разделах выше.
  2. +
  3. Напишите пост с просьбой оценки и/или помощи на MDN Discourse forum Learning category. Ваш пост должен включать: +
      +
    • Описательный заголовок такой как "Требуется оценка проверки навыков по Позиционированияю".
    • +
    • Детали о том, что вы уже попытались сделать и что бы вы хотели, чтобы мы сделали, например, если вы застряли и вам нужна помощь, либо вы хотите оценку.
    • +
    • Ссылку на онлайн редактор (как упомянуто выше в пункте 1) с примером, который нуждается в оценке или с которым нужна помощь. Это хорошая практика чтобы вникнуть — очень сложно помочь кому-либо с проблемным кодом если вы не видите их код.
    • +
    • Ссылку на актуальную задачу или страницу оценки, чтобы мы могли найти вопрос, по которому вам нужна помощь.
    • +
    +
  4. +
-- cgit v1.2.3-54-g00ecf