From 80300961a1f341622b118bb2a3e3099e0944f0b8 Mon Sep 17 00:00:00 2001 From: alina3657362 Date: Tue, 1 Apr 2025 18:19:20 +0500 Subject: [PATCH 1/3] task 1, 2 --- index.html | 56 +++++++++++++++++++++++++++++++++++++++++++++++------- styles.css | 38 ++++++++++++++++++++++++++++++++---- 2 files changed, 83 insertions(+), 11 deletions(-) diff --git a/index.html b/index.html index 5e60e40..c851138 100644 --- a/index.html +++ b/index.html @@ -1,11 +1,53 @@ - - - - - Практика верстки - + - +
+

+ Замыкания в JavaScript для начинающих +

+

+ Замыкания — это одна из фундаментальных концепций JavaScript, вызывающая сложности у многих новичков, + знать и понимать которую должен каждый JS-программист. + Хорошо разобравшись с замыканиями, вы сможете писать более качественный, эффективный и чистый код. + А это, в свою очередь, будет способствовать вашему профессиональному росту.

+ Материал, перевод которого мы публикуем сегодня, посвящён рассказу о внутренних механизмах замыканий + и о том, как они работают в JavaScript-программах. +

+

+ Что такое замыкание? +

+

+ Замыкание — это функция, у которой есть доступ к области видимости, сформированной внешней по + отношению к ней функции даже после того, как эта внешняя функция завершила работу. Это значит, что + в замыкании могут храниться переменные, объявленные во внешней функции и переданные ей аргументы. + Прежде чем мы перейдём, собственно, к замыканиям, разберёмся с понятием «лексическое окружение». +

+

+ Что такое лексическое окружение? +

+

+ Понятие «лексическое окружение» или «статическое окружение» в JavaScript относится к возможности доступа + к переменным, функциям и объектам на основе их физического расположения в исходном коде. Рассмотрим пример: +

+ пикча какая-то +

+ Здесь у функции inner() есть доступ к переменным, объявленным в её собственной области видимости, + в области видимости функции outer() и в глобальной области видимости. Функция + outer() имеет доступ + к переменным, объявленным в её собственной области видимости и в глобальной области видимости.

+ Цепочка областей видимости вышеприведённого кода будет выглядеть так: +

+ ещё пикча +

+ Обратите внимание на то, что функция inner() окружена лексическим окружением функции + outer(), + которая, + в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может + получить + доступ к переменным, объявленным в функции outer() и в глобальной области видимости. +

+
\ No newline at end of file diff --git a/styles.css b/styles.css index 1cbd2e0..c3596c0 100644 --- a/styles.css +++ b/styles.css @@ -1,8 +1,38 @@ -/* Тут пиши основные стили */ +h1{ + font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; + font-size:42px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:44px; +} + +h2{ + font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; + font-size:34px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:44px; +} +img{ + width: 100%; +} +code{ + background-color: #f2f2f2; + font-family: "Courier New", monospace; +} + +#block1{ + margin: 55px 25%; + font-family: Georgia, Cambria, "Times New Roman", Times, serif; + font-size:21px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:33px; +} @media (max-width: 800px) { -/* Тут пиши стили для мобилки. - Стили применятся только когда страничка будет ≤800px шириной - */ + /* Тут пиши стили для мобилки. + Стили применятся только когда страничка будет ≤800px шириной + */ } \ No newline at end of file From a017a073a7ef075ddb6b0c17ed9fdfbf3e6215d8 Mon Sep 17 00:00:00 2001 From: alina3657362 Date: Tue, 1 Apr 2025 18:51:01 +0500 Subject: [PATCH 2/3] task 3 --- index.html | 36 ++++++++++++++++++++++++++---------- styles.css | 45 ++++++++++++++++++++++++++++++++++++++++++++- 2 files changed, 70 insertions(+), 11 deletions(-) diff --git a/index.html b/index.html index c851138..8224f1e 100644 --- a/index.html +++ b/index.html @@ -1,6 +1,26 @@ - + + + + + Практика верстки + - + +пикча какая-то +
+ +

Замыкания в JavaScript для начинающих @@ -29,8 +49,7 @@

Понятие «лексическое окружение» или «статическое окружение» в JavaScript относится к возможности доступа к переменным, функциям и объектам на основе их физического расположения в исходном коде. Рассмотрим пример:

- пикча какая-то + пикча какая-то

Здесь у функции inner() есть доступ к переменным, объявленным в её собственной области видимости, в области видимости функции outer() и в глобальной области видимости. Функция @@ -38,14 +57,11 @@

к переменным, объявленным в её собственной области видимости и в глобальной области видимости.

Цепочка областей видимости вышеприведённого кода будет выглядеть так:

- ещё пикча + ещё пикча

- Обратите внимание на то, что функция inner() окружена лексическим окружением функции - outer(), + Обратите внимание на то, что функция inner() окружена лексическим окружением функции outer(), которая, - в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может - получить + в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может получить доступ к переменным, объявленным в функции outer() и в глобальной области видимости.

diff --git a/styles.css b/styles.css index c3596c0..9ecd8c7 100644 --- a/styles.css +++ b/styles.css @@ -5,7 +5,6 @@ h1{ text-align:left; line-height:44px; } - h2{ font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; font-size:34px; @@ -21,6 +20,40 @@ code{ font-family: "Courier New", monospace; } +#img1 { + width:7%; + height: 5%; + margin: 16px 16px 16px 16px; +} + +.shapka { + font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; + font-size:24px; + color: black; + line-height:54px; + border-top: 2px solid grey; + border-bottom: 2px solid grey; +} + +ul { + list-style-type: none; + margin: 0; + padding: 0; + overflow: hidden; + background-color: lightgrey; +} + +li { + float: left; +} + +li a { + display: block; + color: black; + text-align: center; + padding: 16px; +} + #block1{ margin: 55px 25%; font-family: Georgia, Cambria, "Times New Roman", Times, serif; @@ -32,6 +65,16 @@ code{ @media (max-width: 800px) { + li a { + display: initial; + color: black; + text-align: center; + margin: 0; + padding: 16px; + } + .shapka { + height: 100px; + } /* Тут пиши стили для мобилки. Стили применятся только когда страничка будет ≤800px шириной */ From 49725167a7e732958aca85a228471cde4bfe01c0 Mon Sep 17 00:00:00 2001 From: alina3657362 Date: Tue, 1 Apr 2025 19:31:31 +0500 Subject: [PATCH 3/3] task 4 --- index.html | 79 ++++++++------------------ styles.css | 161 +++++++++++++++++++++++++++++++++++++---------------- 2 files changed, 134 insertions(+), 106 deletions(-) diff --git a/index.html b/index.html index 8224f1e..38ec576 100644 --- a/index.html +++ b/index.html @@ -1,69 +1,34 @@ - + Практика верстки - -пикча какая-то -
+ +
+ -
-
-

- Замыкания в JavaScript для начинающих -

-

- Замыкания — это одна из фундаментальных концепций JavaScript, вызывающая сложности у многих новичков, - знать и понимать которую должен каждый JS-программист. - Хорошо разобравшись с замыканиями, вы сможете писать более качественный, эффективный и чистый код. - А это, в свою очередь, будет способствовать вашему профессиональному росту.

- Материал, перевод которого мы публикуем сегодня, посвящён рассказу о внутренних механизмах замыканий - и о том, как они работают в JavaScript-программах. -

-

- Что такое замыкание? -

-

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

-

- Что такое лексическое окружение? -

-

- Понятие «лексическое окружение» или «статическое окружение» в JavaScript относится к возможности доступа - к переменным, функциям и объектам на основе их физического расположения в исходном коде. Рассмотрим пример: -

- пикча какая-то -

- Здесь у функции inner() есть доступ к переменным, объявленным в её собственной области видимости, - в области видимости функции outer() и в глобальной области видимости. Функция - outer() имеет доступ - к переменным, объявленным в её собственной области видимости и в глобальной области видимости.

- Цепочка областей видимости вышеприведённого кода будет выглядеть так: -

- ещё пикча -

- Обратите внимание на то, что функция inner() окружена лексическим окружением функции outer(), - которая, - в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может получить - доступ к переменным, объявленным в функции outer() и в глобальной области видимости. -

-
+ +

Замыкания в JavaScript для начинающих

+

Замыкания — это одна из фундаментальных концепций JavaScript, вызывающая сложности у многих новичков, знать и понимать которую должен каждый JS-программист. Хорошо разобравшись с замыканиями, вы сможете писать более качественный, эффективный и чистый код. А это, в свою очередь, будет способствовать вашему профессиональному росту. + Материал, перевод которого мы публикуем сегодня, посвящён рассказу о внутренних механизмах замыканий и о том, как они работают в JavaScript-программах.

+

Что такое замыкание?

+

Замыкание — это функция, у которой есть доступ к области видимости, сформированной внешней по отношению к ней функции даже после того, как эта внешняя функция завершила работу. Это значит, что в замыкании могут храниться переменные, объявленные во внешней функции и переданные ей аргументы. Прежде чем мы перейдём, собственно, к замыканиям, разберёмся с понятием «лексическое окружение».

+

Что такое лексическое окружение?

+

Понятие «лексическое окружение» или «статическое окружение» в JavaScript относится к возможности доступа к переменным, функциям и объектам на основе их физического расположения в исходном коде. Рассмотрим пример:

+ +

Здесь у функции inner() есть доступ к переменным, объявленным в её собственной области видимости, в области видимости функции outer() и в глобальной области видимости. Функция outer() имеет доступ к переменным, объявленным в её собственной области видимости и в глобальной области видимости. + Цепочка областей видимости вышеприведённого кода будет выглядеть так:

+ +

Обратите внимание на то, что функция inner() окружена лексическим окружением функции outer(), которая, в свою очередь, окружена глобальной областью видимости. Именно поэтому функция inner() может получить доступ к переменным, объявленным в функции outer() и в глобальной области видимости.

\ No newline at end of file diff --git a/styles.css b/styles.css index 9ecd8c7..7c4af77 100644 --- a/styles.css +++ b/styles.css @@ -1,81 +1,144 @@ -h1{ - font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; +html, body { + margin: 0; +} + +h1 { + font-family: LucidaGrande-Bold; font-size:42px; color:rgba(0,0,0,0.84); text-align:left; line-height:44px; + margin: 55px 25.5% 10px 25.2%; } -h2{ - font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; +h2 { + font-family: LucidaGrande-Bold; font-size:34px; color:rgba(0,0,0,0.84); text-align:left; - line-height:44px; + line-height:39px; + margin: 56px 25.5% 10px 25.2%; } -img{ - width: 100%; +p { + font-family:Georgia; + font-size:21px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:33px; + margin-left: 25.4%; + margin-right: 25.4%; } -code{ - background-color: #f2f2f2; +code { font-family: "Courier New", monospace; + background: #ecefed; } -#img1 { - width:7%; - height: 5%; - margin: 16px 16px 16px 16px; +.main-img { + margin: 43px 25.4% 37px 25.4%; + width: 50%; } -.shapka { - font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Geneva, Arial, sans-serif; - font-size:24px; - color: black; - line-height:54px; - border-top: 2px solid grey; - border-bottom: 2px solid grey; + +nav { + background-color: #ecefed; } -ul { - list-style-type: none; - margin: 0; - padding: 0; - overflow: hidden; - background-color: lightgrey; +header img { + margin: 10px 0 10px 38px; } -li { - float: left; +nav { + border: 1px black solid; + margin: 0 0 0 0; + border-left: none; + border-right: none; +} + +nav ul { + list-style: none; + +} + +nav ul li { + display: inline; + font-family: LucidaGrande, serif; + font-size: 24px; + color: #333333; + text-align: left; + line-height: 36px; + margin-right: 30px; + text-decoration: none; } li a { - display: block; + text-decoration: none; color: black; - text-align: center; - padding: 16px; } -#block1{ - margin: 55px 25%; - font-family: Georgia, Cambria, "Times New Roman", Times, serif; - font-size:21px; - color:rgba(0,0,0,0.84); - text-align:left; - line-height:33px; +li a:hover { + text-decoration: underline; } +a:active { + color: red; +} + + + @media (max-width: 800px) { - li a { - display: initial; - color: black; - text-align: center; - margin: 0; - padding: 16px; + h1 { + font-family:LucidaGrande-Bold; + font-size:26px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:28px; + margin-top: 25px; + margin-bottom: 6px; + margin-left: 3.5%; + margin-right: 3.5%; + } + h2 { + font-family:LucidaGrande-Bold; + font-size:22px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:39px; + margin-left: 3.5%; + margin-right: 3.5%; + } + p { + font-family:Georgia; + font-size:18px; + color:rgba(0,0,0,0.84); + text-align:left; + line-height:22px; + margin-left: 3.5%; + margin-right: 3.5%; + } + code { + font-family: "Courier New", monospace; + background: #ecefed; } - .shapka { - height: 100px; + + .main-img { + margin: 25px 3.5% 25px 3.5%; + width: 92%; + + } + + header img { + margin: 10px 0 10px 38px; + } + + nav ul { + padding-left: 25px; + } + + nav ul li { + display: block; + font-size:20px; + text-align:left; + line-height:25px; + margin-bottom: 5px; } - /* Тут пиши стили для мобилки. - Стили применятся только когда страничка будет ≤800px шириной - */ } \ No newline at end of file