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 --- files/ru/conflicting/mozilla/add-ons/index.html | 30 ++++++------- .../mozilla/firefox/releases/index.html | 2 +- files/ru/conflicting/web/api/push_api/index.html | 2 +- .../conflicting/web/api/xmlhttprequest/index.html | 2 +- .../basic_concepts_of_flexbox/index.html | 2 +- .../index.html | 6 +-- .../index.html | 2 +- files/ru/games/introduction/index.html | 2 +- .../index.html | 2 +- .../3d_on_the_web/glsl_shaders/index.html | 6 +-- .../techniques/controls_gamepad_api/index.html | 4 +- .../create_the_canvas_and_draw_on_it/index.html | 8 ++-- .../game_over/index.html | 6 +-- .../move_the_ball/index.html | 12 +++--- .../track_the_score_and_win/index.html | 2 +- files/ru/glossary/compile/index.html | 2 +- files/ru/glossary/css_selector/index.html | 2 +- files/ru/glossary/speculative_parsing/index.html | 4 +- files/ru/learn/accessibility/html/index.html | 4 +- .../available_text_editors/index.html | 2 +- .../design_for_all_types_of_users/index.html | 2 +- .../how_does_the_internet_work/index.html | 2 +- .../index.html | 16 +++---- .../set_up_a_local_testing_server/index.html | 8 ++-- .../upload_files_to_a_web_server/index.html | 2 +- .../common_questions/using_github_pages/index.html | 2 +- .../what_are_browser_developer_tools/index.html | 36 ++++++++-------- .../what_are_hyperlinks/index.html | 2 +- .../common_questions/what_is_a_url/index.html | 2 +- .../what_software_do_i_need/index.html | 2 +- .../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 +- .../forms/basic_native_form_controls/index.html | 2 +- files/ru/learn/forms/form_validation/index.html | 2 +- .../forms/how_to_structure_a_web_form/index.html | 6 +-- files/ru/learn/forms/index.html | 2 +- .../sending_and_retrieving_form_data/index.html | 6 +-- files/ru/learn/forms/your_first_form/index.html | 4 +- .../how_the_web_works/index.html | 2 +- .../javascript_basics/index.html | 2 +- .../publishing_your_website/index.html | 2 +- .../what_will_your_website_look_like/index.html | 2 +- .../advanced_text_formatting/index.html | 4 +- .../creating_hyperlinks/index.html | 4 +- .../document_and_website_structure/index.html | 24 +++++------ .../getting_started/index.html | 8 ++-- .../ru/learn/html/introduction_to_html/index.html | 4 +- .../structuring_a_page_of_content/index.html | 2 +- .../adding_vector_graphics_to_the_web/index.html | 10 ++--- .../images_in_html/index.html | 4 +- .../mozilla_splash_page/index.html | 2 +- .../other_embedding_technologies/index.html | 2 +- .../responsive_images/index.html | 2 +- .../video_and_audio_content/index.html | 2 +- files/ru/learn/html/tables/advanced/index.html | 2 +- files/ru/learn/html/tables/basics/index.html | 2 +- .../javascript/asynchronous/async_await/index.html | 2 +- .../javascript/asynchronous/introducing/index.html | 4 +- .../asynchronous/timeouts_and_intervals/index.html | 8 ++-- .../build_your_own_function/index.html | 2 +- .../building_blocks/conditionals/index.html | 14 +++--- .../javascript/building_blocks/events/index.html | 14 +++--- .../building_blocks/functions/index.html | 10 ++--- .../building_blocks/image_gallery/index.html | 4 +- .../ru/learn/javascript/building_blocks/index.html | 14 +++--- .../building_blocks/looping_code/index.html | 10 ++--- .../building_blocks/return_values/index.html | 10 ++--- .../test_your_skills_colon__functions/index.html | 2 +- .../javascript/client-side_web_apis/index.html | 4 +- .../client-side_web_apis/introduction/index.html | 6 +-- .../third_party_apis/index.html | 2 +- .../learn/javascript/first_steps/arrays/index.html | 4 +- files/ru/learn/javascript/first_steps/index.html | 2 +- .../javascript/first_steps/variables/index.html | 4 +- .../first_steps/what_is_javascript/index.html | 8 ++-- files/ru/learn/javascript/index.html | 4 +- .../ru/learn/javascript/objects/basics/index.html | 30 ++++++------- files/ru/learn/javascript/objects/index.html | 10 ++--- .../objects/object-oriented_js/index.html | 8 ++-- .../learn/server-side/django/admin_site/index.html | 2 +- .../server-side/django/authentication/index.html | 8 ++-- .../learn/server-side/django/deployment/index.html | 2 +- .../learn/server-side/django/sessions/index.html | 2 +- .../server-side/django/skeleton_website/index.html | 2 +- .../locallibrary_base_template/index.html | 2 +- .../server-side/express_nodejs/forms/index.html | 4 +- .../express_nodejs/introduction/index.html | 6 +-- .../server-side/express_nodejs/mongoose/index.html | 4 +- .../first_steps/introduction/index.html | 2 +- .../feature_detection/index.html | 2 +- files/ru/mdn/about/index.html | 2 +- files/ru/mdn/contribute/getting_started/index.html | 14 +++--- files/ru/mdn/contribute/index.html | 2 +- .../tools/kumascript/troubleshooting/index.html | 2 +- files/ru/mozilla/add-ons/index.html | 12 +++--- .../anatomy_of_a_webextension/index.html | 2 +- .../api/runtime/getmanifest/index.html | 2 +- .../add-ons/webextensions/examples/index.html | 6 +-- .../webextensions/internationalization/index.html | 34 +++++++-------- .../add-ons/webextensions/manifest.json/index.html | 6 +-- .../user_interface/extension_pages/index.html | 2 +- .../what_are_webextensions/index.html | 2 +- .../your_first_webextension/index.html | 10 ++--- .../your_second_webextension/index.html | 18 ++++---- files/ru/mozilla/developer_guide/index.html | 8 ++-- .../developer_guide/introduction/index.html | 4 +- .../developer_guide/mozilla-central/index.html | 2 +- .../so_you_just_built_firefox/index.html | 2 +- files/ru/mozilla/firefox/releases/43/index.html | 2 +- .../mdn/community/working_in_community/index.html | 4 +- .../howto/do_a_technical_review/index.html | 16 +++---- .../howto/do_an_editorial_review/index.html | 14 +++--- .../index.html" | 2 +- .../index.html" | 10 ++--- .../index.html" | 4 +- .../index.html" | 2 +- .../index.html" | 2 +- files/ru/tools/index.html | 4 +- .../how_to/examine_and_edit_html/index.html | 2 +- .../how_to/select_an_element/index.html | 2 +- files/ru/tools/performance/index.html | 8 ++-- files/ru/tools/shader_editor/index.html | 16 +++---- files/ru/tools/style_editor/index.html | 2 +- files/ru/tools/tools_toolbox/index.html | 6 +-- files/ru/tools/web_console/index.html | 12 +++--- .../index.html | 2 +- files/ru/web/api/attr/index.html | 2 +- .../createmediaelementsource/index.html | 6 +-- files/ru/web/api/beforeunloadevent/index.html | 2 +- .../api/canvas_api/tutorial/basic_usage/index.html | 4 +- .../canvas_api/tutorial/drawing_shapes/index.html | 2 +- .../managing_screen_orientation/index.html | 4 +- files/ru/web/api/document/createrange/index.html | 2 +- files/ru/web/api/element/currentstyle/index.html | 2 +- .../api/eventtarget/addeventlistener/index.html | 6 +-- .../ru/web/api/eventtarget/eventtarget/index.html | 2 +- files/ru/web/api/fetch_api/using_fetch/index.html | 2 +- files/ru/web/api/gamepadevent/gamepad/index.html | 2 +- .../using_the_geolocation_api/index.html | 2 +- .../web/api/globaleventhandlers/onclick/index.html | 4 +- files/ru/web/api/history/index.html | 4 +- files/ru/web/api/htmlaudioelement/audio/index.html | 2 +- files/ru/web/api/htmldialogelement/open/index.html | 2 +- .../api/htmlmediaelement/abort_event/index.html | 2 +- .../api/indexeddb_api/using_indexeddb/index.html | 4 +- files/ru/web/api/performance/index.html | 2 +- files/ru/web/api/pushmanager/subscribe/index.html | 2 +- .../using_server-sent_events/index.html | 2 +- .../using_service_workers/index.html | 8 ++-- files/ru/web/api/speechrecognition/index.html | 2 +- files/ru/web/api/storage/key/index.html | 2 +- files/ru/web/api/storage_access_api/index.html | 2 +- .../ru/web/api/vrdisplay/requestpresent/index.html | 2 +- files/ru/web/api/web_audio_api/index.html | 2 +- .../visualizations_with_web_audio_api/index.html | 8 ++-- .../using_the_web_storage_api/index.html | 2 +- files/ru/web/api/webvr_api/index.html | 2 +- .../api/webvr_api/using_the_webvr_api/index.html | 20 ++++----- files/ru/web/api/webxr_device_api/index.html | 2 +- .../web/api/window/beforeunload_event/index.html | 2 +- files/ru/web/api/xmlhttprequest/timeout/index.html | 2 +- files/ru/web/css/_colon_where/index.html | 2 +- files/ru/web/css/align-content/index.html | 2 +- .../css_animations/using_css_animations/index.html | 10 ++--- .../basic_concepts_of_flexbox/index.html | 2 +- .../mastering_wrapping_of_flex_items/index.html | 8 ++-- .../basic_concepts_of_grid_layout/index.html | 6 +-- .../css_grid_layout/grid_template_areas/index.html | 6 +-- .../layout_using_named_grid_lines/index.html | 2 +- .../line-based_placement_with_css_grid/index.html | 16 +++---- .../relationship_of_grid_layout/index.html | 18 ++++---- files/ru/web/css/filter/index.html | 4 +- .../media_queries/using_media_queries/index.html | 4 +- files/ru/web/css/text-shadow/index.html | 4 +- .../guide/css/block_formatting_context/index.html | 2 +- files/ru/web/guide/graphics/index.html | 2 +- files/ru/web/guide/index.html | 6 +-- files/ru/web/guide/performance/index.html | 2 +- files/ru/web/guide/user_input_methods/index.html | 2 +- files/ru/web/html/element/a/index.html | 2 +- files/ru/web/html/element/code/index.html | 2 +- files/ru/web/html/element/img/index.html | 2 +- files/ru/web/html/element/input/date/index.html | 2 +- .../html/element/input/datetime-local/index.html | 6 +-- files/ru/web/html/element/input/radio/index.html | 20 ++++----- files/ru/web/html/element/meta/index.html | 4 +- files/ru/web/html/element/picture/index.html | 2 +- files/ru/web/html/element/select/index.html | 2 +- files/ru/web/html/element/slot/index.html | 2 +- files/ru/web/html/element/title/index.html | 2 +- files/ru/web/html/preloading_content/index.html | 2 +- files/ru/web/http/headers/content-type/index.html | 2 +- files/ru/web/http/status/index.html | 2 +- files/ru/web/javascript/guide/functions/index.html | 14 +++--- .../javascript/guide/meta_programming/index.html | 2 +- .../javascript/guide/numbers_and_dates/index.html | 2 +- .../web/javascript/guide/using_promises/index.html | 2 +- .../ru/web/javascript/memory_management/index.html | 2 +- .../classes/private_class_fields/index.html | 2 +- .../errors/cant_assign_to_property/index.html | 2 +- .../errors/deprecated_source_map_pragma/index.html | 2 +- .../ru/web/javascript/reference/errors/index.html | 2 +- .../reference/errors/not_a_constructor/index.html | 6 +-- .../javascript/reference/functions/get/index.html | 8 ++-- .../global_objects/array/@@unscopables/index.html | 4 +- .../reference/global_objects/error/index.html | 2 +- .../reference/global_objects/map/set/index.html | 2 +- .../global_objects/regexp/@@search/index.html | 2 +- .../global_objects/symbol/search/index.html | 2 +- .../global_objects/symbol/unscopables/index.html | 4 +- .../reference/global_objects/typedarray/index.html | 2 +- .../global_objects/uint8clampedarray/index.html | 2 +- .../reference/global_objects/uneval/index.html | 2 +- .../reference/lexical_grammar/index.html | 2 +- .../reference/operators/addition/index.html | 2 +- .../operators/addition_assignment/index.html | 2 +- .../reference/operators/assignment/index.html | 2 +- .../reference/operators/delete/index.html | 6 +-- .../operators/optional_chaining/index.html | 2 +- .../javascript/reference/operators/this/index.html | 2 +- files/ru/web/manifest/display/index.html | 2 +- files/ru/web/mathml/element/math/index.html | 2 +- files/ru/web/mathml/examples/index.html | 2 +- files/ru/web/mathml/index.html | 4 +- files/ru/web/performance/fundamentals/index.html | 2 +- .../ru/web/svg/tutorial/getting_started/index.html | 2 +- files/ru/web/svg/tutorial/gradients/index.html | 4 +- files/ru/web/svg/tutorial/index.html | 4 +- files/ru/web/svg/tutorial/patterns/index.html | 6 +-- .../using_custom_elements/index.html | 2 +- files/ru/webassembly/c_to_wasm/index.html | 2 +- .../ru/webassembly/loading_and_running/index.html | 2 +- .../understanding_the_text_format/index.html | 6 +-- .../using_the_javascript_api/index.html | 12 +++--- 255 files changed, 664 insertions(+), 664 deletions(-) (limited to 'files') diff --git a/files/ru/conflicting/mozilla/add-ons/index.html b/files/ru/conflicting/mozilla/add-ons/index.html index 09e3f37570..15ef217dfb 100644 --- a/files/ru/conflicting/mozilla/add-ons/index.html +++ b/files/ru/conflicting/mozilla/add-ons/index.html @@ -7,10 +7,10 @@ tags: original_slug: Building_an_Extension ---

Введение

-

Этот урок по шагам покажет Вам как создать простое Расширение – сутью которого является добавление в панель статуса Firefox блока со строкой "Hello, World!"

+

Этот урок по шагам покажет вам как создать простое Расширение – сутью которого является добавление в панель статуса Firefox блока со строкой "Hello, World!"

Отметьте Данный урок о создании Расширений для Firefox 1.5 и более поздних версий. Другие существующие уроки для создания Расширений, предназначены для более ранних версий.

-

Если Вас интересует урок по созданию Расширения для Thunderbird, смотрите Создание Расширения для Thunderbird

+

Если вас интересует урок по созданию Расширения для Thunderbird, смотрите Создание Расширения для Thunderbird

Настройка окружения

Начнём с того, что Расширение распространяется в виде zip архива или Пакетов, с расширением XPI (произносится как “зиппи”).

@@ -39,7 +39,7 @@ original_slug: Building_an_Extension

<pre> #!/bin/sh h=$HOME/moExt mkdir -p $h/my_extension/chrome/content touch $h/my_extension/chrome.manifest $h/my_extension/install.rdf </pre> Более подробную информацию по настройке окружения читайте в статье Setting up extension development environment.

Создание файла инсталляции

-

Откройте файл install.rdf который Вы создали на предыдущем этапе и вставьте эти строки:

+

Откройте файл install.rdf который вы создали на предыдущем этапе и вставьте эти строки:

<?xml version="1.0"?>
 
 <RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
@@ -70,13 +70,13 @@ original_slug: Building_an_Extension
 </RDF>
 
    -
  • sample@example.net - идентификатор вашего Расширения. Это - значение, которое Вы должны придумать сами, чтобы идентифицировать Ваше Расширение, в данном случае оно в формате адреса электронной почты (это не обязательно должна быть Ваша электронная почта). Этот идентификатор должен быть уникальным. Вы можете также использовать GUID. ЗАМЕТКА: Хотя этот параметр и ДОЛЖЕН быть в формате адреса электронной почты, но не обязательно должен быть действительным адресом электронной почты. (example.example.example)
  • -
  • Определение <em:type>2</em:type> -- объявляет, что устанавливается именно расширение. Если бы Вы устанавливали тему, то это было бы 4 ( Install Manifests#type for other type codes).
  • +
  • sample@example.net - идентификатор вашего Расширения. Это - значение, которое вы должны придумать сами, чтобы идентифицировать ваше Расширение, в данном случае оно в формате адреса электронной почты (это не обязательно должна быть Ваша электронная почта). Этот идентификатор должен быть уникальным. Вы можете также использовать GUID. ЗАМЕТКА: Хотя этот параметр и ДОЛЖЕН быть в формате адреса электронной почты, но не обязательно должен быть действительным адресом электронной почты. (example.example.example)
  • +
  • Определение <em:type>2</em:type> -- объявляет, что устанавливается именно расширение. Если бы вы устанавливали тему, то это было бы 4 ( Install Manifests#type for other type codes).
  • {ec8030f7-c20a-464f-9b0e-13a3a9e97384} - Идентификатор приложения Firefox.
  • -
  • 1.5 - минимальная версия Firefox, с которой будет работать Ваше Расширение. Укажите здесь минимальную версию, для которой будет выполняться все необходимые тесты.
  • -
  • 3.0.* - - максимальная версия Firefox, с которой будет работать Ваше Расширение. Укажите здесь, самую свежую, доступную в данный момент версию. В этом случае, "3.0.*" указывает на то, что расширение работает с Firefox 3.0 и любыми последующими 3.0.x версиями.
  • +
  • 1.5 - минимальная версия Firefox, с которой будет работать ваше Расширение. Укажите здесь минимальную версию, для которой будет выполняться все необходимые тесты.
  • +
  • 3.0.* - - максимальная версия Firefox, с которой будет работать ваше Расширение. Укажите здесь, самую свежую, доступную в данный момент версию. В этом случае, "3.0.*" указывает на то, что расширение работает с Firefox 3.0 и любыми последующими 3.0.x версиями.
-

(В Firefox версии 3.0.1, вы не сможете установить для em:minVersion и em:maxVersion значение "3.0.*". Если Вы попытаетесь установить Расширение, то получите ошибку "Not compatible with Firefox 3.0.1". Мне не ясны причины этого, так что я оставлю объяснение тому, кто имеет больше информации по этому поводу. Установка em:minVersion равным "3" и em:maxVersion равным "3.0.*" решило проблему для меня.)

+

(В Firefox версии 3.0.1, вы не сможете установить для em:minVersion и em:maxVersion значение "3.0.*". Если вы попытаетесь установить Расширение, то получите ошибку "Not compatible with Firefox 3.0.1". Мне не ясны причины этого, так что я оставлю объяснение тому, кто имеет больше информации по этому поводу. Установка em:minVersion равным "3" и em:maxVersion равным "3.0.*" решило проблему для меня.)

Расширения разработанные для работы только с последними версиями Firefox 2.0.0.x, должны иметь установленным максимальную версию в "2.0.0. *". Расширения, разработанные для работы с только с последними версиями Firefox 1.5.0.x, должны иметь установленным максимальную версию "1.5.0. *".

Более подробно См. Install Manifests с полным перечнем основных и дополнительных свойств.

Сохраните файл.

@@ -115,10 +115,10 @@ original_slug: Building_an_Extension
  • Путь файла, для загрузки.
  • Так, chrome://foo/skin/bar.png  загружает файл bar.png из темы foo раздела skin.

    -

    Когда Вы загружаете содержимое, используя Chrome URI, Firefox использует системный реестр Chrome, чтобы транслировать URIs в фактические исходные файлы на диске (или в пакетах JAR).

    +

    Когда вы загружаете содержимое, используя Chrome URI, Firefox использует системный реестр Chrome, чтобы транслировать URIs в фактические исходные файлы на диске (или в пакетах JAR).

    Создание установок Chrome

    Для получения дополнительной информации об установках Chrome и о поддерживаемых свойствах руководство по Chrome Manifest.

    -

    Откройте файл с названием chrome.manifest который Вы создали рядом с каталогом chrome в корне исходной иерархии директории Вашего Расширения.

    +

    Откройте файл с названием chrome.manifest который вы создали рядом с каталогом chrome в корне исходной иерархии директории вашего Расширения.

    Добавьте в него код:

    content     sample    chrome/content/
     
    @@ -126,12 +126,12 @@ original_slug: Building_an_Extension

    Здесь определяется:

    1. тип материала в пределах chrome пакета
    2. -
    3. название chrome пакета (удостоверьтесь, что Вы используете все символы в нижнем регистре для имени пакета ("sample"), так как во 2-й версии не поддерживается смешанные регистры и вы получите ошибку {{ Bug(132183) }}
    4. +
    5. название chrome пакета (удостоверьтесь, что вы используете все символы в нижнем регистре для имени пакета ("sample"), так как во 2-й версии не поддерживается смешанные регистры и вы получите ошибку {{ Bug(132183) }}
    6. местоположение файлов chrome пакета

    Эта строка говорит, что для chrome пакета с именем sample, файлы информационного наполнения находятся в chrome/content, который является путём относительно местоположения chrome.manifest.

    Заметьте, что content, locale и skin должны быть сохранены как каталоги, с соответствующими именами content, locale и skin в подкаталоге chrome.

    -

    Сохраните файл. Когда Вы запустите Firefox со своим расширением, (это будет позже в данном уроке), chrome пакет будет зарегистрирован.

    +

    Сохраните файл. Когда вы запустите Firefox со своим расширением, (это будет позже в данном уроке), chrome пакет будет зарегистрирован.

    Регистрация Оверлея

    Вам нужно присоединить ваш оверлей к окну браузера Firefox, при его отображении. Для этого добавьте следующую строку файл chrome.manifest:

    overlay chrome://browser/content/browser.xul chrome://sample/content/sample.xul
    @@ -159,7 +159,7 @@ original_slug: Building_an_Extension
     
    Установка с web-страниц

    Существует множество путей, которыми вы можете устанавливать ваши расширения прямо с web-страниц, в том числе использование прямых ссылок на файлы XPI и использование InstallTrigger method объекта. Разработчикам расширений и веб разработчикам, рекомендуется использовать для установки XPI методы InstallTrigger, которые дают больше возможностей их пользователям.

    Использование addons.mozilla.org
    -

    С помощью сайта Mozilla Add-ons вы может распространять ваше Расширение для бесплатного пользования. Вше расширение будет иметь зеркала на Mozilla, что обеспечит доступность вашего расширения, если оно станет очень популярным. Сайт Mozilla также упрощает установку расширений для пользователей , и автоматически сделает доступными ваши новые версии для пользователей вашей текущей версии, после того как вы загрузите их. Кроме того Mozilla Add-ons позволяет пользователям оставлять комментарии и тем самым обеспечивает обратную связь с Вашим Расширением. Настоятельно рекомендуется использовать Mozilla Add-ons для распространения ваших расширений!

    +

    С помощью сайта Mozilla Add-ons вы может распространять ваше Расширение для бесплатного пользования. Вше расширение будет иметь зеркала на Mozilla, что обеспечит доступность вашего расширения, если оно станет очень популярным. Сайт Mozilla также упрощает установку расширений для пользователей , и автоматически сделает доступными ваши новые версии для пользователей вашей текущей версии, после того как вы загрузите их. Кроме того Mozilla Add-ons позволяет пользователям оставлять комментарии и тем самым обеспечивает обратную связь с вашим Расширением. Настоятельно рекомендуется использовать Mozilla Add-ons для распространения ваших расширений!

    Зайдите на http://addons.mozilla.org/developers/ создайте учётную запись и начинайте распространение ваших расширений!

    Примечание:Ваше Расширение будет скачиваться быстрее и чаще, если у вас будет хорошее описание и скриншоты с вашим расширением в действии.

    Регистрация расширений в реестре Windows
    @@ -197,7 +197,7 @@ pref("extensions.sample.showAdvanced", true); //булево

    I should move the useful parts of this to the Command Line page. -Nickolay This is done by adding a component containing the function... function NSGetModule(comMgr, fileSpec) { return myAppHandlerModule; } This function is run by firefox each time firefox is started. Firefox registers the myAppHandlerModule's by calling its 'registerSelf()'. Then it obtains the myAppHandlerModule's handler factory via 'getClassObject()'. The handler factory is then used to create the handle using its 'createInstance(). Finally, the handle's 'handle(cmdline)' processes the command line cmdline's handleFlagWithParam() and handleFlag(). Смотрите Chrome: Command Line , а также обсуждения на форуме.

    Локализация

    -

    Для поддержки более чем одного языка, вы должны вместо отдельных строк из вашего содержимого использовать "сущности" или a href="mks://localhost/en/XUL_Tutorial/Property_Files" title="en/XUL_Tutorial/Property_Files">"связки строк". Это лучше делать в самом начале разработки Вашего Расширения, а не возвращаться, к этому позже!

    +

    Для поддержки более чем одного языка, вы должны вместо отдельных строк из вашего содержимого использовать "сущности" или a href="mks://localhost/en/XUL_Tutorial/Property_Files" title="en/XUL_Tutorial/Property_Files">"связки строк". Это лучше делать в самом начале разработки вашего Расширения, а не возвращаться, к этому позже!

    Информация о локализации хранится в каталоге локализации расширения. Например, чтобы добавить локализацию для нашего расширения, создайте директорию с именем "locale" в каталоге chrome (где находится каталог "content" ) и добавьте следующую строчку в файл chrome.manifest:

    locale sample en-US chrome/locale/en-US/
     
    @@ -220,7 +220,7 @@ pref("extensions.sample.showAdvanced", true); //булево

    Understanding the Browser

    Use the DOM Inspector to inspect the browser window or any other XUL window you want to extend.

    Примечание: DOM Inspector не устанавливается в режиме стандартной установки Firefox. Начиная с версии Firefox 3 Beta 4, DOM Inspector доступен с сайта Firefox Add-ons, как автономное расширение. Для более ранних версий, вам необходимо переустановить FireFox в режиме Пользовательской установки и выбрать путь к DOM Inspector(или Developer Tools в Firefox 1.5), если DOM Inspector'a нет в меню Инструменты (Tools) в вашего браузера.

    -

    Используйте кнопку Point-and-click icon в верхнем правом углу панели инструментов DOM Inspector для визуального выбора интересующего элемента в окне XUL. После выбора элемента, в окне DOM inspector появится DOM иерархия интересующего Вас элемента.

    +

    Используйте кнопку Point-and-click icon в верхнем правом углу панели инструментов DOM Inspector для визуального выбора интересующего элемента в окне XUL. После выбора элемента, в окне DOM inspector появится DOM иерархия интересующего вас элемента.

    Use the DOM Inspector's right side panel to discover merge points with ids that you can use to insert your elements from overlays. If you cannot discover an element with an id that you can merge into, you may need to attach a script in your overlay and insert your elements when the load event fires on the master XUL window.

    Debugging Extensions

    Analytical Tools for Debugging

    diff --git a/files/ru/conflicting/mozilla/firefox/releases/index.html b/files/ru/conflicting/mozilla/firefox/releases/index.html index d5066a55be..13789bf239 100644 --- a/files/ru/conflicting/mozilla/firefox/releases/index.html +++ b/files/ru/conflicting/mozilla/firefox/releases/index.html @@ -121,7 +121,7 @@ original_slug: Tools/Release_notes
    • Редактор шейдеров позволяет просматривать и редактировать шейдеры WebGL
    • -
    • Возможность поставить точку остановки в дебаггере на определённое DOM событие которое Вам нужно отловить
    • +
    • Возможность поставить точку остановки в дебаггере на определённое DOM событие которое вам нужно отловить
    • Редактирование HTML в Инспекторе
    • See color swatches and background images in the Inspector's Rules view
    • The Web Веб консольConsole now logs reflow events
    • diff --git a/files/ru/conflicting/web/api/push_api/index.html b/files/ru/conflicting/web/api/push_api/index.html index 69d74485f5..289aa4704d 100644 --- a/files/ru/conflicting/web/api/push_api/index.html +++ b/files/ru/conflicting/web/api/push_api/index.html @@ -37,7 +37,7 @@ original_slug: Web/API/Push_API/Using_the_Push_API

      Обычно необходима комбинация этих двух решений; демо внизу включает пример обоих.

      -

      Примечание: Вам необходим некоторый код, запущенный на сервере, для управления конечной точкой/шифрованием данных и отправки запросов push-сообщений. В нашем демо мы собрали на скорую руку сервер, используя NodeJS.

      +

      Примечание: вам необходим некоторый код, запущенный на сервере, для управления конечной точкой/шифрованием данных и отправки запросов push-сообщений. В нашем демо мы собрали на скорую руку сервер, используя NodeJS.

      Сервис воркер так же должен подписаться на сервис push-сообщений. Каждой сессии предоставляется собственная уникальная конечная точка, когда она подписывается на сервис push-сообщений. Эта конечная точка получается из свойства  ({{domxref("PushSubscription.endpoint")}}) объекта подписчика. Она может быть отправлена серверу и использоваться для пересылки сообщений активному сервис воркеру сессии. Каждый браузер имеет свой собственный сервер push-сообщений для  управления отправкой push-сообщений.

      diff --git a/files/ru/conflicting/web/api/xmlhttprequest/index.html b/files/ru/conflicting/web/api/xmlhttprequest/index.html index d8515b4665..10503ded9b 100644 --- a/files/ru/conflicting/web/api/xmlhttprequest/index.html +++ b/files/ru/conflicting/web/api/xmlhttprequest/index.html @@ -116,7 +116,7 @@ req.send(null);

      Этот метод может быть использован чтобы установить HTTP заголовок в запросе до его отправки.

      -
      Замечание: Вы должны вызвать вначале open().
      +
      Замечание: вы должны вызвать вначале open().
      var req = new XMLHttpRequest();
       req.open('GET', 'http://www.mozilla.org/', true);
      diff --git a/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
      index c84556c8be..e51bc42a20 100644
      --- a/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
      +++ b/files/ru/conflicting/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html
      @@ -10,7 +10,7 @@ original_slug: Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes
       
       
       
      -

      У меня не поднялась рука удалить эту статью окончательно, но я рекомендую Вам вместо неё, всё-таки, прочитать ту.

      +

      У меня не поднялась рука удалить эту статью окончательно, но я рекомендую вам вместо неё, всё-таки, прочитать ту.

      {{CSSRef}}
      diff --git a/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html b/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html index b9e0c98b1c..c102798643 100644 --- a/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html +++ b/files/ru/conflicting/web/javascript/guide/introduction_6f341ba6db4b060ccbd8dce4a0d5214b/index.html @@ -18,7 +18,7 @@ original_slug: Web/JavaScript/Guide/JavaScript_Overview
    • Server-side JavaScript расширяет ядро языка предоставляя объекты для запуска JavaScript на сервере. Например, server-side расширения позволяют приложению соединяться с реляционной базой данных, обеспечивать непрерывность информации между вызовами приложения, или выполнять операции над файлами на сервере.
    -

    Используя функции JavaScript LiveConnect, Вы можете позволить коду на Java и JavaScript общаться между собой. Вы можете создать экземпляр объекта Java из JavaScript и получить доступ к его публичным методам и свойствам. Из Java, Вы можете получить доступ к объектам, свойствам и методам JavaScript.

    +

    Используя функции JavaScript LiveConnect, вы можете позволить коду на Java и JavaScript общаться между собой. Вы можете создать экземпляр объекта Java из JavaScript и получить доступ к его публичным методам и свойствам. Из Java, вы можете получить доступ к объектам, свойствам и методам JavaScript.

    Впервые JavaScript был использован в браузерах Netscape.

    @@ -28,9 +28,9 @@ original_slug: Web/JavaScript/Guide/JavaScript_Overview

    В отличии от системы компилированных классов в Java, построенной на объявлениях, JavaScript поддерживает систему исполнения, основанную на небольшом количестве типов данных, представляющих числовые, логические и строковые значения. JavaScript обладает моделью объектов на базе прототипов вместо более общей модели объектов на базе классов. Модель объектов на базе прототипов делает возможным динамическое наследование; то есть, то, что унаследовано, может различаться для отдельных объектов. JavaScript также поддерживает функции без каких-либо специальных декларативных требований. Функции могут быть свойствами объектов, выполняться как слабо типизированные методы.

    -

    По сравнению с Java, JavaScript - это язык с очень свободной формой языка. Вам не надо объявлять переменные, классы или методы. Вы не должны беспокоиться, является ли метод public, private или protected, Вам не надо реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы не являются явно типизированными.

    +

    По сравнению с Java, JavaScript - это язык с очень свободной формой языка. Вам не надо объявлять переменные, классы или методы. Вы не должны беспокоиться, является ли метод public, private или protected, вам не надо реализовывать интерфейсы. Переменные, параметры и возвращаемые функциями типы не являются явно типизированными.

    -

    Java - язык программирования на основе классов, предназначенный для быстрого выполнения и безопасности типов. Безопасность типов означает, например, что Вы не можете взять тип Java integer и привести его к типу object reference или получить доступ к закрытой памяти изменяя байт-код Java. Ориентированная на классы модель Java означает, что программы состоят исключительно из классов и их методов. Наследование классов и строгая типизация в Java обычно требуют тесно связанную иерархию объектов. Эти требования делают программирование на Java более сложным чем на JavaScript.

    +

    Java - язык программирования на основе классов, предназначенный для быстрого выполнения и безопасности типов. Безопасность типов означает, например, что вы не можете взять тип Java integer и привести его к типу object reference или получить доступ к закрытой памяти изменяя байт-код Java. Ориентированная на классы модель Java означает, что программы состоят исключительно из классов и их методов. Наследование классов и строгая типизация в Java обычно требуют тесно связанную иерархию объектов. Эти требования делают программирование на Java более сложным чем на JavaScript.

    По духу JavaScript происходит от нескольких небольших, динамически типизированных языков программирования, таких как HyperTalk и dBASE. Эти скриптовые языки предлагают инструменты программирования для гораздо более широкой аудитории благодаря более простому синтаксису, специальной встроенной функциональности и минимальным требованиям для создания объектов.

    diff --git a/files/ru/conflicting/web/progressive_web_apps_628955cdadd77b10ec99de034fc76374/index.html b/files/ru/conflicting/web/progressive_web_apps_628955cdadd77b10ec99de034fc76374/index.html index 26b2ec685c..482e7a0e42 100644 --- a/files/ru/conflicting/web/progressive_web_apps_628955cdadd77b10ec99de034fc76374/index.html +++ b/files/ru/conflicting/web/progressive_web_apps_628955cdadd77b10ec99de034fc76374/index.html @@ -13,7 +13,7 @@ translation_of_original: Web/Progressive_web_apps/Discoverable original_slug: Web/Progressive_web_apps/Заметный ---
    -
    Как только вы опубликуете новое веб-приложение, вы захотите, чтобы мир узнал об этом. Поисковые системы, конечно, помогают, но, обычно, большее внимание уделяется тому, как Ваши приложения представлены на результатах поиска. Новый манифест W3C для веб-приложений может помочь с этим и предоставить дополнительные возможности.
    +
    Как только вы опубликуете новое веб-приложение, вы захотите, чтобы мир узнал об этом. Поисковые системы, конечно, помогают, но, обычно, большее внимание уделяется тому, как ваши приложения представлены на результатах поиска. Новый манифест W3C для веб-приложений может помочь с этим и предоставить дополнительные возможности.
    diff --git a/files/ru/games/introduction/index.html b/files/ru/games/introduction/index.html index 91f7517e0a..2ceec285f2 100644 --- a/files/ru/games/introduction/index.html +++ b/files/ru/games/introduction/index.html @@ -14,7 +14,7 @@ original_slug: Games/Ввод

    Современный web позволяет не только передавать различную информацию, но и создавать интерактивный контент. Например, потрясающие, высококачественные игры.

    -

    Диапазон игр, которые Вы можете встретить в web поражает и не уступает "нативным" играм, реализованным с использованием языка программирования c++ и java.Причём это касается не только относительно небольших игр, но и объёмных игр жанра РПГ, 3d шутерах и многом другом. Это уже не аналоги простых карточных игр или многопользовательских социальных играх, реализованных с помощью Flash®, а гораздо более сложные вещи. Благодаря значительным улучшениям языка программирования JavaScript и появлению новых API браузера, Вы можете создавать игры, не зависящие от операционной системы. Для их работы необходим только браузер. А иногда, например на устройствах с поддержкой HTML5, таких как Firefox OS, не нужен даже он.

    +

    Диапазон игр, которые вы можете встретить в web поражает и не уступает "нативным" играм, реализованным с использованием языка программирования c++ и java.Причём это касается не только относительно небольших игр, но и объёмных игр жанра РПГ, 3d шутерах и многом другом. Это уже не аналоги простых карточных игр или многопользовательских социальных играх, реализованных с помощью Flash®, а гораздо более сложные вещи. Благодаря значительным улучшениям языка программирования JavaScript и появлению новых API браузера, вы можете создавать игры, не зависящие от операционной системы. Для их работы необходим только браузер. А иногда, например на устройствах с поддержкой HTML5, таких как Firefox OS, не нужен даже он.

    Игровая платформа HTML5

    diff --git a/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html b/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html index ce110daaa6..32962eecda 100644 --- a/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html +++ b/files/ru/games/techniques/3d_on_the_web/building_up_a_basic_demo_with_three.js/index.html @@ -160,7 +160,7 @@ render();
    cube.rotation.set(0.4, 0.2, 0);
     
    -

    Поздравляю, Вы создали объект в 3D-среде! This might have proven easier than you first thought? Here's how it should look:

    +

    Поздравляю, вы создали объект в 3D-среде! This might have proven easier than you first thought? Here's how it should look:

    Blue cube on a gray background rendered with Three.js.

    diff --git a/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html b/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html index 1109ce0997..2d89598517 100644 --- a/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html +++ b/files/ru/games/techniques/3d_on_the_web/glsl_shaders/index.html @@ -15,7 +15,7 @@ translation_of: Games/Techniques/3D_on_the_web/GLSL_Shaders

    GLSL не так прост в изучении, как JavaScript. GLSL является строго типизированным и в нем часто используются операции с векторами и матрицами. It can get very complicated — very quickly. В этой статье мы создадим небольшой пример кода, который отображает куб. Чтобы ускорить разработку, мы будем использовать Three.js API.

    -

    Как Вы помните из статьи о теоретических основах, вертекс или вершина это точка в системе 3D координат. Также вершины могут иметь дополнительные свойства. Система 3D координат определяет пространство, а вертексы позволяют определять формы в этом пространстве.

    +

    Как вы помните из статьи о теоретических основах, вертекс или вершина это точка в системе 3D координат. Также вершины могут иметь дополнительные свойства. Система 3D координат определяет пространство, а вертексы позволяют определять формы в этом пространстве.

    Типы шейдеров

    @@ -43,10 +43,10 @@ translation_of: Games/Techniques/3D_on_the_web/GLSL_Shaders

    Настройка окружения

    -

    Чтобы приступить к работе с шейдерами WebGL Вам потребуется:

    +

    Чтобы приступить к работе с шейдерами WebGL вам потребуется:

      -
    • Убедиться, что Вы используете современный браузер, который хорошо поддерживает WebGL, например Firefox или Chrome.
    • +
    • Убедиться, что вы используете современный браузер, который хорошо поддерживает WebGL, например Firefox или Chrome.
    • Создать папку, в которой будете хранить результаты ваших экспериментов.
    • Сохранить копию последней минимизированной версии библиотеки Three.js в созданную папку.
    diff --git a/files/ru/games/techniques/controls_gamepad_api/index.html b/files/ru/games/techniques/controls_gamepad_api/index.html index 153a341c49..b3ce642241 100644 --- a/files/ru/games/techniques/controls_gamepad_api/index.html +++ b/files/ru/games/techniques/controls_gamepad_api/index.html @@ -37,7 +37,7 @@ translation_of: Games/Techniques/Controls_Gamepad_API

    The competition ran in November 2013 and  decided to take part in it. The theme for the competition was "change", so they submitted a game where you have to feed the Hungry Fridge by tapping the healthy food (apples, carrots, lettuces) and avoid the "bad" food (beer, burgers, pizza.) A countdown changes the type of food the Fridge wants to eat every few seconds, so you have to be careful and act quickly. You can try Hungry Fridge here.

    -

    Конкурс GitHub Game Off II состоялся в ноябре 2013 года, и Enclave Games решила принять в нем участие. Тема для конкурса была "переменна", поэтому они представили игру, в которой Вы должны накормить голодный холодильник, нажав на здоровую пищу (яблоки, морковь, салат) и избежать "плохой" пищи (пиво, гамбургеры, пицца.) Обратный отсчёт меняет тип пищи, которую холодильник хочет съесть каждые несколько секунд, поэтому вы должны быть осторожны и действовать быстро. Вы можете попробовать Голодный холодильник здесь.

    +

    Конкурс GitHub Game Off II состоялся в ноябре 2013 года, и Enclave Games решила принять в нем участие. Тема для конкурса была "переменна", поэтому они представили игру, в которой вы должны накормить голодный холодильник, нажав на здоровую пищу (яблоки, морковь, салат) и избежать "плохой" пищи (пиво, гамбургеры, пицца.) Обратный отсчёт меняет тип пищи, которую холодильник хочет съесть каждые несколько секунд, поэтому вы должны быть осторожны и действовать быстро. Вы можете попробовать Голодный холодильник здесь.

    hungryfridge-mainmenu

    @@ -58,7 +58,7 @@ translation_of: Games/Techniques/Controls_Gamepad_API

    Код, описанный ниже, взят из полной версии игры Hungry Fridge, но он почти идентичен демо-версии — единственная разница заключается в том, что полная версия использует переменную turbo, чтобы решить, будет ли игра запущена с использованием режима Super Turbo. Он работает независимо, поэтому его можно включить, даже если геймпад не подключён.

    -

    ПРИМЕЧАНИЕ: время пасхальных яиц: есть скрытая опция для запуска Super Turbo Hungry Fridge на рабочем столе без подключения геймпада — нажмите на значок геймпада в правом верхнем углу экрана. Он запустит игру в режиме Super Turbo, и Вы сможете управлять холодильником с помощью клавиатуры: A и D для поворота башни влево и вправо, W для стрельбы и клавиш со стрелками для перемещения.

    +

    ПРИМЕЧАНИЕ: время пасхальных яиц: есть скрытая опция для запуска Super Turbo Hungry Fridge на рабочем столе без подключения геймпада — нажмите на значок геймпада в правом верхнем углу экрана. Он запустит игру в режиме Super Turbo, и вы сможете управлять холодильником с помощью клавиатуры: A и D для поворота башни влево и вправо, W для стрельбы и клавиш со стрелками для перемещения.

    Реализация

    diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html index 4e8984d006..7e4b3d8e30 100644 --- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/create_the_canvas_and_draw_on_it/index.html @@ -26,7 +26,7 @@ original_slug: >-

    HTML игры

    -

    Структура HTML документа довольно проста, так как игра будет полностью визуализироваться в {{htmlelement("canvas")}} элементе. Используя Ваш любимый текстовый редактор, создайте новый HTML документ, сохраните его как index.html в любом удобном месте, и скопируйте в него этот код:

    +

    Структура HTML документа довольно проста, так как игра будет полностью визуализироваться в {{htmlelement("canvas")}} элементе. Используя ваш любимый текстовый редактор, создайте новый HTML документ, сохраните его как index.html в любом удобном месте, и скопируйте в него этот код:

    <!DOCTYPE html>
     <html>
    @@ -71,7 +71,7 @@ ctx.closePath();

    Все инструкции располагаются между методами {{domxref("CanvasRenderingContext2D.beginPath()","beginPath()")}} и {{domxref("CanvasRenderingContext2D.closePath()","closePath()")}}. Мы определяем прямоугольник, используя  {{domxref("CanvasRenderingContext2D.rect()","rect()")}}: первые два параметра определяют координаты верхнего левого угла прямоугольника на canvas, в то время, как два других параметра определяют ширину и высоту прямоугольника. В нашем случае прямоугольник нарисован на расстоянии 20 пикселей слева и 40 пикселей сверху, 50 пикселей в ширину и 50 пикселей в высоту, что делает его квадратом. Свойство {{domxref("CanvasRenderingContext2D.fillStyle","fillStyle")}} хранит цвет, который будет использован методом {{domxref("CanvasRenderingContext2D.fill()","fill()")}} для отрисовки нашего квадрата.

    -

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

    +

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

    ctx.beginPath();
     ctx.arc(240, 160, 20, 0, Math.PI*2, false);
    @@ -90,7 +90,7 @@ ctx.closePath();

    Свойство {{domxref("CanvasRenderingContext2D.fillStyle","fillStyle")}} выглядит не так, как прежде. Это потому что, как и в CSS, цвет может быть задан в шестнадцатеричном формате, названием цвета, функцией rgba() , или же любым другим методом для цвета.

    -

    Вместо {{domxref("CanvasRenderingContext2D.fill()","fill()")}} и заполнения фигур цветом, можно использовать {{domxref("CanvasRenderingContext2D.stroke()","stroke()")}}, чтобы окрасить только внешнюю обводку фигуры. Попробуйте добавить этот код к Вашему коду JavaScript:

    +

    Вместо {{domxref("CanvasRenderingContext2D.fill()","fill()")}} и заполнения фигур цветом, можно использовать {{domxref("CanvasRenderingContext2D.stroke()","stroke()")}}, чтобы окрасить только внешнюю обводку фигуры. Попробуйте добавить этот код к вашему коду JavaScript:

    ctx.beginPath();
     ctx.rect(160, 10, 100, 40);
    @@ -100,7 +100,7 @@ ctx.closePath();

    Код выше отрисовывает пустой прямоугольник с синей обводкой. Благодаря функции альфа-канала rgba() , голубой цвет полупрозрачный.

    -

    Сравните Ваш код

    +

    Сравните ваш код

    Здесь полный исходный код для первого урока, посмотреть онлайн можно на JSFiddle:

    diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html index 8fa11624a5..2ac0f101e6 100644 --- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/game_over/index.html @@ -62,7 +62,7 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {

    Отбить шар

    -

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

    +

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

    if(y + dy < ballRadius) {
         dy = -dy;
    @@ -76,11 +76,11 @@ if(y + dy > canvas.height-ballRadius || y + dy < ballRadius) {
         }
     }
    -

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

    +

    Если мяч направляется к нижнему краю Canvas, мы должны проверить, касается ли он биты. Если да, то шар возвращается прочь точно так же, как вы ожидали бы; если не тогда игра заканчивается.

    Сравните свой код

    -

    Вот рабочий код для Вас, чтобы сравнить Ваш с:

    +

    Вот рабочий код для вас, чтобы сравнить ваш с:

    {{JSFiddleEmbed("https://jsfiddle.net/raymondjplante/L61c9y50/","","395")}}

    diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html index 45f650d6b4..5738a86402 100644 --- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/move_the_ball/index.html @@ -22,13 +22,13 @@ original_slug: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Перемест

    Это 2й шаг из 10 Gamedev Canvas tutorial. Вы можете найти исходный код для данного урока по ссылке Gamedev-Canvas-workshop/lesson2.html.

    -

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

    +

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

    Определяем цикл рисования

    Чтобы canvas постоянно обновлялся, необходимо определить функцию отрисовки, которая будет циклически запускаться с разными параметрами, чтобы изменять позицию элемента. Функцию можно циклически запускать с помощью JavaScript временной функции, такой как {{domxref("WindowTimers.setInterval()", "setInterval()")}} или {{domxref("window.requestAnimationFrame()", "requestAnimationFrame()")}}.

    -

    Удалите весь JavaScript код, который сейчас хранился в Вашем HTML файле, за исключением первых двух строк, и добавьте следующий код после них. Функция draw() будет исполняться внутри функции setInterval каждые 10 мс:

    +

    Удалите весь JavaScript код, который сейчас хранился в вашем HTML файле, за исключением первых двух строк, и добавьте следующий код после них. Функция draw() будет исполняться внутри функции setInterval каждые 10 мс:

    function draw() {
         // код отрисовки
    @@ -44,7 +44,7 @@ ctx.fill();
     ctx.closePath();
     
    -

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

    +

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

    Перемещение

    @@ -85,7 +85,7 @@ var dy = -2; y += dy; } -

    Сохраните Ваш код и откройте страницу в браузере. Всё работает хорошо, вот только мяч оставляет позади след:

    +

    Сохраните ваш код и откройте страницу в браузере. Всё работает хорошо, вот только мяч оставляет позади след:

    @@ -107,7 +107,7 @@ var dy = -2; } -

    Сохраните Ваш код и попробуйте снова, и на этот раз Вы увидите, что мяч перемещается без следов. Каждые 10 мс canvas очищается, голубой круг (наш мяч) отрисовывается на заданной позиции, переменные x и y каждую итерацию обновляются.

    +

    Сохраните ваш код и попробуйте снова, и на этот раз вы увидите, что мяч перемещается без следов. Каждые 10 мс canvas очищается, голубой круг (наш мяч) отрисовывается на заданной позиции, переменные x и y каждую итерацию обновляются.

    Рефакторинг

    @@ -130,7 +130,7 @@ function draw() { y += dy; } -

    Сравните Ваш код

    +

    Сравните ваш код

    Вы можете проверить итоговый код для этого урока с помощью демо, а так же поэкспериментировать с ним, изменяя те или иные параметры:

    diff --git a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html index cef5f1e065..d8dffe125c 100644 --- a/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html +++ b/files/ru/games/tutorials/2d_breakout_game_pure_javascript/track_the_score_and_win/index.html @@ -95,6 +95,6 @@ translation_of: Games/Tutorials/2D_Breakout_game_pure_JavaScript/Track_the_score

    Следующие шаги

    -

    На данный момент игра выглядит довольно хорошо. В следующем уроке Вы расширите привлекательность игры, добавив Mouse controls.

    +

    На данный момент игра выглядит довольно хорошо. В следующем уроке вы расширите привлекательность игры, добавив Mouse controls.

    {{PreviousNext("Games/Workflows/2D_Breakout_game_pure_JavaScript/Collision_detection", "Games/Workflows/2D_Breakout_game_pure_JavaScript/Mouse_controls")}}

    diff --git a/files/ru/glossary/compile/index.html b/files/ru/glossary/compile/index.html index 83648d5c7a..2c65feca8c 100644 --- a/files/ru/glossary/compile/index.html +++ b/files/ru/glossary/compile/index.html @@ -11,7 +11,7 @@ original_slug: Словарь/Compile

    Обычно компилятор преобразует язык более высокого уровня, такой как C или Java который понимает человек, в машинный язык, такой как ассемблер, который понимает процессор. Некоторые компиляторы, которые переводят между языками схожего уровня, называются транспайлерами или кросс-компиляторами, например, для компиляции с TypeScript на JavaScript. Они считаются инструментами производительности.

    Большинство компиляторов работают либо перед исполнением (AOT), либо во время исполнения (JIT). Как программист, вы обычно вызываете AOT-компиляторы из командной строки или из {{Glossary("IDE")}}. Самый известный "gcc" - это один из примеров.
    - JIT компиляторы обычно прозрачны для Вас и используются для повышения производительности. Например, в браузере: Firefox' SpiderMonkey JavaScript Engine имеет встроенный JIT, который скомпилирует JavaScript на сайте в машинный код, пока Вы его просматриваете, чтобы он работал быстрее. Такие проекты, как WebAssembly, работают над тем, чтобы сделать это ещё лучше.

    + JIT компиляторы обычно прозрачны для вас и используются для повышения производительности. Например, в браузере: Firefox' SpiderMonkey JavaScript Engine имеет встроенный JIT, который скомпилирует JavaScript на сайте в машинный код, пока вы его просматриваете, чтобы он работал быстрее. Такие проекты, как WebAssembly, работают над тем, чтобы сделать это ещё лучше.

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

    diff --git a/files/ru/glossary/css_selector/index.html b/files/ru/glossary/css_selector/index.html index cd525405be..39a70ee4a8 100644 --- a/files/ru/glossary/css_selector/index.html +++ b/files/ru/glossary/css_selector/index.html @@ -10,7 +10,7 @@ tags: translation_of: Glossary/CSS_Selector original_slug: Словарь/CSS_Selector --- -

    CSS-селектор это часть CSS-правила, которая позволяет Вам указать, к какому элементу (элементам) применить стиль. Например:

    +

    CSS-селектор это часть CSS-правила, которая позволяет вам указать, к какому элементу (элементам) применить стиль. Например:

    ***HTML***
     <div> I am inside of a div element. </div>
    diff --git a/files/ru/glossary/speculative_parsing/index.html b/files/ru/glossary/speculative_parsing/index.html
    index 975dbd7ccb..568901ec21 100644
    --- a/files/ru/glossary/speculative_parsing/index.html
    +++ b/files/ru/glossary/speculative_parsing/index.html
    @@ -1,5 +1,5 @@
     ---
    -title: Оптимизация Ваших страниц для рискованного парсинга
    +title: Оптимизация ваших страниц для рискованного парсинга
     slug: Glossary/speculative_parsing
     tags:
       - HTML
    @@ -18,7 +18,7 @@ original_slug: Web/HTML/Optimizing_Your_Pages_for_Speculative_Parsing
     

    Есть только одно правило, чтобы сделать рискованную загрузку скриптов, стилей и изображений успешной:

      -
    • Если Вы используете элемент <base>, чтобы заменить основной URI страницы, поместите этот элемент в часть страницы без скриптов. Не добавляйте его с помощью document.write() или document.createElement().
    • +
    • Если вы используете элемент <base>, чтобы заменить основной URI страницы, поместите этот элемент в часть страницы без скриптов. Не добавляйте его с помощью document.write() или document.createElement().

    Как избежать перестройки дерева страницы

    diff --git a/files/ru/learn/accessibility/html/index.html b/files/ru/learn/accessibility/html/index.html index d4c6fed82c..af0dc28ff9 100644 --- a/files/ru/learn/accessibility/html/index.html +++ b/files/ru/learn/accessibility/html/index.html @@ -103,8 +103,8 @@ original_slug: Learn/Доступность/HTML
    1. Скринридер озвучивает каждый заголовок по мере перемещения, оповещая вас, что является заголовком, а что параграфом. 
    2. Он останавливается после каждого элемента, позволяя вам переместиться в любое другое место, которое вам надо.
    3. -
    4. Во многих скринридерах Вы можете перемещаться к следующему/предыдущему заголовкам.
    5. -
    6. Во многих скринридерах Вы также можете вызвать список всех заголовков, который можно использовать как содержание, чтобы найти определённую информацию. 
    7. +
    8. Во многих скринридерах вы можете перемещаться к следующему/предыдущему заголовкам.
    9. +
    10. Во многих скринридерах вы также можете вызвать список всех заголовков, который можно использовать как содержание, чтобы найти определённую информацию. 

    Иногда люди используют презентационные элементы HTML и перенос строки, чтобы написать заголовки или параграфы:

    diff --git a/files/ru/learn/common_questions/available_text_editors/index.html b/files/ru/learn/common_questions/available_text_editors/index.html index b9ef48555c..a545341a1c 100644 --- a/files/ru/learn/common_questions/available_text_editors/index.html +++ b/files/ru/learn/common_questions/available_text_editors/index.html @@ -211,7 +211,7 @@ translation_of: Learn/Common_questions/Available_text_editors

    С какой ОС (операционной системой) я хочу работать?

    -

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

    +

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

    So first find out which OS you're using, and then check if a given editor supports your OS. Most editors specify on their website whether they support Windows or Mac, though some editors only support certain versions (say, only Windows 7 or later and not Vista). If you're running Ubuntu, your best bet is to search within the Ubuntu Software Center. In general, of course, the Linux/UNIX world is a pretty diverse place where different distros work with different, incompatible packaging systems. That means, if you've set your heart on an obscure text editor, you may have to compile it from source yourself (not for the faint-hearted).

    diff --git a/files/ru/learn/common_questions/design_for_all_types_of_users/index.html b/files/ru/learn/common_questions/design_for_all_types_of_users/index.html index 7b3ceb5b95..a44f7c9d9c 100644 --- a/files/ru/learn/common_questions/design_for_all_types_of_users/index.html +++ b/files/ru/learn/common_questions/design_for_all_types_of_users/index.html @@ -126,7 +126,7 @@ span.subheading { font-size:1rem; } /* исходный размер */

    Так ведь проще, правда? Это работает как в Internet Explorer 9, так и в любом другом поддерживаемом браузере, поэтому, пожалуйста, не стесняйтесь использовать этот способ.

    -

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

    +

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

    Почему мне следует использовать пропорциональные единицы измерения?

    diff --git a/files/ru/learn/common_questions/how_does_the_internet_work/index.html b/files/ru/learn/common_questions/how_does_the_internet_work/index.html index 5aa8814771..e6d3d18b57 100644 --- a/files/ru/learn/common_questions/how_does_the_internet_work/index.html +++ b/files/ru/learn/common_questions/how_does_the_internet_work/index.html @@ -54,7 +54,7 @@ original_slug: Learn/How_the_Internet_works

    Two computers linked together

    -

    Таким способом Вы можете подключить более двух компьютеров, но с каждым новым это становится все сложнее. Если хочется подключить, скажем, 10 компьютеров, вам понадобится 45 кабелей и 9 сетевых плат в каждом компьютере!

    +

    Таким способом вы можете подключить более двух компьютеров, но с каждым новым это становится все сложнее. Если хочется подключить, скажем, 10 компьютеров, вам понадобится 45 кабелей и 9 сетевых плат в каждом компьютере!

    Ten computers all together

    diff --git a/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html b/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html index a7a189fb93..9ac829f056 100644 --- a/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html +++ b/files/ru/learn/common_questions/pages_sites_servers_and_search_engines/index.html @@ -32,9 +32,9 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

    В двух словах

    -

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

    +

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

    -

    Мы разберём эти понятия и технологии чуть позже, а сейчас краткие определения ниже станут для Вас очень хорошим началом:

    +

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

    Веб-страница
    @@ -49,7 +49,7 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

    Активное изучение

    -

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

    +

    Пока что активное изучение не доступно. Если вы можете предоставить полезную информацию, то, пожалуйста, окажите нам содействие

    Погружаемся глубже

    @@ -69,7 +69,7 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

    Примечание: браузеры зачастую могут отображать некоторые документы в формате PDF файла или изображения, но термин веб-страница больше относится непосредственно к HTML-документам. До конца статьи, в данном случае, мы будем использовать понятие  документ.

    -

    Все веб-страницы в сети имеют свой уникальный адрес. Чтобы получить доступ к нужной странице просто наберите её адрес в адресной строке Вашего браузера:

    +

    Все веб-страницы в сети имеют свой уникальный адрес. Чтобы получить доступ к нужной странице просто наберите её адрес в адресной строке вашего браузера:

    Example of a web page address in the browser address bar

    @@ -87,7 +87,7 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

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

    -

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

    +

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

    Example of a web site domain name in the browser address bar

    @@ -97,15 +97,15 @@ original_slug: Learn/Pages_sites_servers_and_search_engines

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

    -

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

    +

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

    Поисковая система

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

    -

    Наиболее популярные поисковые системы: Google, Bing, Yandex, DuckDuckGo, и многие другие. Некоторые из них универсальны, а какие-то ориентированы на определённую область. Используйте тот поисковик, который удобен Вам.

    +

    Наиболее популярные поисковые системы: Google, Bing, Yandex, DuckDuckGo, и многие другие. Некоторые из них универсальны, а какие-то ориентированы на определённую область. Используйте тот поисковик, который удобен вам.

    -

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

    +

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

    Ниже пример того, как браузер Firerox по умолчанию отображает окно поиска Google на стартовой (домашней) странице:

    diff --git a/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html b/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html index 7d8aa69e33..d5d0f440ba 100644 --- a/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html +++ b/files/ru/learn/common_questions/set_up_a_local_testing_server/index.html @@ -4,14 +4,14 @@ slug: Learn/Common_questions/set_up_a_local_testing_server translation_of: Learn/Common_questions/set_up_a_local_testing_server ---
    -

    Эта статья объясняет как установить простой локальный тестовый сервер на Вашем компьютере, а так же основы его использования.

    +

    Эта статья объясняет как установить простой локальный тестовый сервер на вашем компьютере, а так же основы его использования.

    - + @@ -45,7 +45,7 @@ translation_of: Learn/Common_questions/set_up_a_local_testing_server
    1. -

      Установить Python. Если Вы пользуетесь Linux или Mac OS X, всё уже готово в Вашей системе. Если Вы пользователь Windows, Вы можете скачать установочный файл с домашней страницы Python:

      +

      Установить Python. Если вы пользуетесь Linux или Mac OS X, всё уже готово в вашей системе. Если вы пользователь Windows, вы можете скачать установочный файл с домашней страницы Python:

      • Зайдите на python.org
      • @@ -62,7 +62,7 @@ translation_of: Learn/Common_questions/set_up_a_local_testing_server
        python -V
      • -

        Система вернёт Вам номер версии установленной программы. В случае успешного выполнения команды python -V  нужно перейти в директорию с вашим проектом, используя команду cd:

        +

        Система вернёт вам номер версии установленной программы. В случае успешного выполнения команды python -V  нужно перейти в директорию с вашим проектом, используя команду cd:

        # include the directory name to enter it, for example
         cd Desktop
        diff --git a/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html b/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html
        index 44b935aafb..03e45d3874 100644
        --- a/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html
        +++ b/files/ru/learn/common_questions/upload_files_to_a_web_server/index.html
        @@ -36,7 +36,7 @@ translation_of: Learn/Common_questions/Upload_files_to_a_web_server
         

        Примечание: Конечно, есть много других вариантов. Смотрите Publishing tools для других способов.

        -

        Откройте приложение FileZilla; Вы должны увидеть что-то вроде этого:

        +

        Откройте приложение FileZilla; вы должны увидеть что-то вроде этого:

        diff --git a/files/ru/learn/common_questions/using_github_pages/index.html b/files/ru/learn/common_questions/using_github_pages/index.html index b4d4c2e05c..38a3443ce3 100644 --- a/files/ru/learn/common_questions/using_github_pages/index.html +++ b/files/ru/learn/common_questions/using_github_pages/index.html @@ -40,7 +40,7 @@ translation_of: Learn/Common_questions/Using_Github_pages

        -

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

        +

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

        Каждая операционная система поставляется с инструментом командной строки:

        diff --git a/files/ru/learn/common_questions/what_are_browser_developer_tools/index.html b/files/ru/learn/common_questions/what_are_browser_developer_tools/index.html index a104e24554..ab6e0c9470 100644 --- a/files/ru/learn/common_questions/what_are_browser_developer_tools/index.html +++ b/files/ru/learn/common_questions/what_are_browser_developer_tools/index.html @@ -20,16 +20,16 @@ original_slug: Learn/Discover_browser_developer_tools

        {{Previous("Learn/Getting_started_with_the_web")}}

        -

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

        +

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

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

        -

        Как открыть инструменты веб-разработчика в Вашем браузере?

        +

        Как открыть инструменты веб-разработчика в вашем браузере?

        -

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

        +

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

        @@ -47,27 +47,27 @@ original_slug: Learn/Discover_browser_developer_tools
        • Firefox. Открыть меню ➤ Инструменты разработки, или Инструменты ➤ Веб-разработка ➤ Инструменты разработки
        • Chrome. Дополнительные инструменты ➤ Инструменты разработчика
        • -
        • Safari. Разработка Показать Web Inspector . Если Вы не видите меню "Разработка", зайдите в  Safari Настройки ➤ Дополнительно,  и проверьте стоит ли галочка напротив "Показать меню разработки"
        • -
        • Opera. Меню Разработка ➤ Инструменты разработчика. Если Вы не видите меню "Разработка",  включите его отображение, перейдя в Меню Другие инструменты  Показать меню разработчика.
        • +
        • Safari. Разработка Показать Web Inspector . Если вы не видите меню "Разработка", зайдите в  Safari Настройки ➤ Дополнительно,  и проверьте стоит ли галочка напротив "Показать меню разработки"
        • +
        • Opera. Меню Разработка ➤ Инструменты разработчика. Если вы не видите меню "Разработка",  включите его отображение, перейдя в Меню Другие инструменты  Показать меню разработчика.
      • -
      • Контекстное меню. Нажмите правой кнопкой мыши на любом участке веб-страницы (Ctrl-клик для Mac), появится контекстное меню, в котором Вам нужно выбрать пункт Исследовать Элемент. (дополнение: этот способ отобразит Вам код того элемента, на котором вы щёлкнули правой кнопкой.)
      • +
      • Контекстное меню. Нажмите правой кнопкой мыши на любом участке веб-страницы (Ctrl-клик для Mac), появится контекстное меню, в котором вам нужно выбрать пункт Исследовать Элемент. (дополнение: этот способ отобразит вам код того элемента, на котором вы щёлкнули правой кнопкой.)

      Inspector: DOM обозреватель и CSS редактор

      -

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

      +

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

      -

      Если Вы не видите Inspector,

      +

      Если вы не видите Inspector,

      • Нажмите на вкладку Inspector .
      • В Internet Explorer, нажмите на DOM Обозреватель, или нажмите Ctrl + 1.
      • -
      • В Safari, элементы управления представлены не так чётко, но Вы должны увидеть HTML код, если Вы не выбрали что-то другое в окне разработки. Нажмите на кнопку Стиль, чтобы увидеть CSS.
      • +
      • В Safari, элементы управления представлены не так чётко, но вы должны увидеть HTML код, если вы не выбрали что-то другое в окне разработки. Нажмите на кнопку Стиль, чтобы увидеть CSS.

      Обзор DOM inspector

      @@ -79,11 +79,11 @@ original_slug: Learn/Discover_browser_developer_tools
      • Удалить узел (иногда Удалить элемент). Удаляет текущий элемент.
      • Править как HTML (иногда Добавить атрибут/Править текст). Позволяет редактировать HTML и видеть результат "вживую". Очень полезно для отладки и тестирования.
      • -
      • :hover/:active/:focus. Заставляет элементы переключить своё состояние на то, к которому применён Ваш стиль.
      • +
      • :hover/:active/:focus. Заставляет элементы переключить своё состояние на то, к которому применён ваш стиль.
      • Копировать/Копировать как HTML. Копирует текущий выделенный HTML.
      -

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

      +

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

      Обзор CSS редактора

      @@ -97,17 +97,17 @@ original_slug: Learn/Discover_browser_developer_tools
    2. Свойства, применённые к текущему элементу, отображаются в порядке убывания приоритета.
    3. Можно убирать галочки напротив свойств для того чтобы видеть, что получится, если их удалить.
    4. Нажмите на маленькую стрелочку рядом со свойством, чтобы увидеть все его эквиваленты.
    5. -
    6. Нажмите на имя свойства или его значение, чтобы открыть текстовое окошко, в котором Вы можете задать новые значения и увидеть, как изменится Ваш элемент с новыми значениями.
    7. -
    8. Рядом с каждым свойством указаны имя файла и номер строки. где располагается это свойство. Щелчок по этому пути перенесёт Вас в окно, где можно редактировать этот CSS и сохранить.
    9. -
    10. Вы можете также нажать на закрывающуюся фигурную скобку любого свойства, чтобы вывести текстовое поле на новую строку, где Вы сможете написать совершенно новую декларацию для Вашей страницы.
    11. +
    12. Нажмите на имя свойства или его значение, чтобы открыть текстовое окошко, в котором вы можете задать новые значения и увидеть, как изменится ваш элемент с новыми значениями.
    13. +
    14. Рядом с каждым свойством указаны имя файла и номер строки. где располагается это свойство. Щелчок по этому пути перенесёт вас в окно, где можно редактировать этот CSS и сохранить.
    15. +
    16. Вы можете также нажать на закрывающуюся фигурную скобку любого свойства, чтобы вывести текстовое поле на новую строку, где вы сможете написать совершенно новую декларацию для вашей страницы.
    17. Вы должно быть уже заметили другие вкладки в  CSS редакторе:

      • Вычислено: Здесь указаны все вычисления свойств выделенного элемента (окончательные, нормализованные значения применённые браузером).
      • -
      • Блоковая модель: Отображает блочную модель выделенного элемента, здесь Вы можете увидеть внешние и внутренние отступы, а также границы применённые к элементу, здесь также указан их размер.
      • -
      • Анимации: В Firefox, на вкладке Анимации Вы можете увидеть анимации применённые к выделенному элементу.
      • +
      • Блоковая модель: Отображает блочную модель выделенного элемента, здесь вы можете увидеть внешние и внутренние отступы, а также границы применённые к элементу, здесь также указан их размер.
      • +
      • Анимации: В Firefox, на вкладке Анимации вы можете увидеть анимации применённые к выделенному элементу.

      Узнать больше

      @@ -123,7 +123,7 @@ original_slug: Learn/Discover_browser_developer_tools

      Консоль JavaScript 

      -

      Консоль JavaScript невероятно полезный инструмент для отладки JavaScript, если он не работает, как ожидалось. Она позволяет Вам загружать JavaScript вопреки порядку загрузки скрипта в браузере, и докладывает об ошибках как только браузер пытается выполнить Ваш код. Для доступа к консоли из любого браузера просто нажмите на кнопку Console. (В Internet Explorer, нажмите Ctrl + 2.) Откроется окно, как показано ниже:

      +

      Консоль JavaScript невероятно полезный инструмент для отладки JavaScript, если он не работает, как ожидалось. Она позволяет вам загружать JavaScript вопреки порядку загрузки скрипта в браузере, и докладывает об ошибках как только браузер пытается выполнить ваш код. Для доступа к консоли из любого браузера просто нажмите на кнопку Console. (В Internet Explorer, нажмите Ctrl + 2.) Откроется окно, как показано ниже:

      @@ -159,7 +159,7 @@ document.querySelector('h1').appendChild(myImage);
    -

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

    +

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

    Узнать больше

    diff --git a/files/ru/learn/common_questions/what_are_hyperlinks/index.html b/files/ru/learn/common_questions/what_are_hyperlinks/index.html index e422ec2bd6..346e394e78 100644 --- a/files/ru/learn/common_questions/what_are_hyperlinks/index.html +++ b/files/ru/learn/common_questions/what_are_hyperlinks/index.html @@ -94,7 +94,7 @@ original_slug: Learn/Understanding_links_on_the_web

    Следующие шаги

    -

    Так что теперь, конечно, Вы захотите создать несколько веб-страниц со ссылками!

    +

    Так что теперь, конечно, вы захотите создать несколько веб-страниц со ссылками!

    • Чтобы получить более теоретическое обоснование, узнайте об URL-адресах и их структуре, поскольку каждая ссылка указывает на URL-адрес.
    • diff --git a/files/ru/learn/common_questions/what_is_a_url/index.html b/files/ru/learn/common_questions/what_is_a_url/index.html index dfa4941a67..d30ced6c03 100644 --- a/files/ru/learn/common_questions/what_is_a_url/index.html +++ b/files/ru/learn/common_questions/what_is_a_url/index.html @@ -37,7 +37,7 @@ original_slug: Learn/Understanding_URLs

      Активное обучение

      -

      Активного обучения пока не существует. Пожалуйста подумайте, возможно Вы сможете внести свой вклад.

      +

      Активного обучения пока не существует. Пожалуйста подумайте, возможно вы сможете внести свой вклад.

      Подробная информация

      diff --git a/files/ru/learn/common_questions/what_software_do_i_need/index.html b/files/ru/learn/common_questions/what_software_do_i_need/index.html index 9dcefce216..1d7118a79d 100644 --- a/files/ru/learn/common_questions/what_software_do_i_need/index.html +++ b/files/ru/learn/common_questions/what_software_do_i_need/index.html @@ -34,7 +34,7 @@ translation_of: Learn/Common_questions/What_software_do_I_need

      Создание и редактирование веб-страниц

      -

      Для создания и редактирования веб-страниц необходим текстовый редактор. Тестовые редакторы создают и изменяют неотформатированные текстовые файлы. (Другие форматы, такие как {{Glossary("RTF")}}, позволяют добавить форматирование, такое как полужирное или подчёркивание. Эти форматы не подходят для написания веб-страниц.) Вам следует выбирать текстовый редактор с умом, так как вы будете активно работать с ним, при создании веб-сайта.

      +

      Для создания и редактирования веб-страниц необходим текстовый редактор. Тестовые редакторы создают и изменяют неотформатированные текстовые файлы. (Другие форматы, такие как {{Glossary("RTF")}}, позволяют добавить форматирование, такое как полужирное или подчёркивание. Эти форматы не подходят для написания веб-страниц.) вам следует выбирать текстовый редактор с умом, так как вы будете активно работать с ним, при создании веб-сайта.

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

      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. Загрузите Ваш код на CodePenjsFiddle или Glitch.
    2. -
    3. Напишите пост с просьбой о помощи и / или оценке на форуме MDN. Добавьте тег "learning" к вашему посту, чтобы нам легче было его найти. В Вашем посте должны быть: +
    4. Загрузите ваш код на CodePenjsFiddle или Glitch.
    5. +
    6. Напишите пост с просьбой о помощи и / или оценке на форуме MDN. Добавьте тег "learning" к вашему посту, чтобы нам легче было его найти. В вашем посте должны быть:
      • Заголовок с описанием наподобие "Assessment wanted for CSS First Steps".
      • -
      • Описание того, что Вам нужно, — к примеру, что Вы уже пробовали, что у Вас не получается и Вам нужна помощь.
      • +
      • Описание того, что вам нужно, — к примеру, что вы уже пробовали, что у вас не получается и вам нужна помощь.
      • Ссылка на ваш код в онлайн-редакторе.
      • -
      • Ссылка на страницу о помощи, чтобы мы смогли помочь Вам с вашим вопросом.
      • +
      • Ссылка на страницу о помощи, чтобы мы смогли помочь вам с вашим вопросом.

    Что дальше?

    -

    Поздравляем Вас с завершением первого модуля! Теперь Вы неплохо разбираетесь в 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 предоставляет некоторые полезные идеи того как это использовать

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

    diff --git a/files/ru/learn/forms/basic_native_form_controls/index.html b/files/ru/learn/forms/basic_native_form_controls/index.html index 1b9ae6b9d7..996ff8bede 100644 --- a/files/ru/learn/forms/basic_native_form_controls/index.html +++ b/files/ru/learn/forms/basic_native_form_controls/index.html @@ -96,7 +96,7 @@ original_slug: Learn/HTML/Forms/Стандартные_виджеты_форм

    Однострочные текстовые поля создаются с использованием элемента {{HTMLElement("input")}}  чей атрибут {{htmlattrxref("type","input")}} имеет значение text (если вы не поставите другое значение атрибута {{htmlattrxref("type","input")}}, text является значением по умолчанию). Значение text для этого атрибута является возвратным, если значение которое вы определили для {{htmlattrxref("type","input")}} неизвестно браузеру (например, если вы определили type="date" а браузер не поддерживает выбор даты).

    -

    Note: Вы можете найти примеры всех типов однострочных текстовых полей на GitHub at single-line-text-fields.html (see it live also).

    +

    Note: вы можете найти примеры всех типов однострочных текстовых полей на GitHub at single-line-text-fields.html (see it live also).

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

    diff --git a/files/ru/learn/forms/form_validation/index.html b/files/ru/learn/forms/form_validation/index.html index fd3c1a68e1..60d63b9d75 100644 --- a/files/ru/learn/forms/form_validation/index.html +++ b/files/ru/learn/forms/form_validation/index.html @@ -165,7 +165,7 @@ input:valid {

    {{EmbedLiveSample("The_required_attribute", "100%", 80)}}

    -

    Note: Вы можете найти этот пример на GitHub как fruit-validation.html (также смотрите source code.)

    +

    Note: вы можете найти этот пример на GitHub как fruit-validation.html (также смотрите source code.)

    Попробуйте эту форму без значения. Обратите внимание как невалидный ввод получает фокус, сообщение об ошибке ("Пожалуйста заполните поле") появляется, и форма не отправляется.

    diff --git a/files/ru/learn/forms/how_to_structure_a_web_form/index.html b/files/ru/learn/forms/how_to_structure_a_web_form/index.html index 378a004392..47a150bafd 100644 --- a/files/ru/learn/forms/how_to_structure_a_web_form/index.html +++ b/files/ru/learn/forms/how_to_structure_a_web_form/index.html @@ -71,7 +71,7 @@ original_slug: Learn/HTML/Forms/How_to_structure_an_HTML_form </form>
    -

    Примечание: Вы можете найти этот пример в fieldset-legend.html (также посмотрите на результат).

    +

    Примечание: вы можете найти этот пример в fieldset-legend.html (также посмотрите на результат).

    Читая эту форму, экранный диктор произнесёт "Fruit juice size small" для первого элемента, "Fruit juice size medium" - для второго, "Fruit juice size large" - для третьего.

    @@ -116,7 +116,7 @@ original_slug: Learn/HTML/Forms/How_to_structure_an_HTML_form </form>
    -

    Примечание: Вы можете посмотреть этот пример тут checkbox-label.html (также можно посмотреть код вживую).

    +

    Примечание: вы можете посмотреть этот пример тут checkbox-label.html (также можно посмотреть код вживую).

    Несколько лейблов

    @@ -164,7 +164,7 @@ original_slug: Learn/HTML/Forms/How_to_structure_an_HTML_form
    -

    Примечание: Вы можете найти этот пример на GitHub required-labels.html (также можно посмотреть вживую). Запускайте пример, закомментировав остальные, иначе скриридеры не смогут правильно распознать контент, если у вас будет несколько лейблов и несколько текстовых полей с одинаковым ID!

    +

    Примечание: вы можете найти этот пример на GitHub required-labels.html (также можно посмотреть вживую). Запускайте пример, закомментировав остальные, иначе скриридеры не смогут правильно распознать контент, если у вас будет несколько лейблов и несколько текстовых полей с одинаковым ID!

    Часто используемые с формами HTML-структуры

    diff --git a/files/ru/learn/forms/index.html b/files/ru/learn/forms/index.html index 7c7be951c7..e4a7c87d31 100644 --- a/files/ru/learn/forms/index.html +++ b/files/ru/learn/forms/index.html @@ -12,7 +12,7 @@ original_slug: Learn/HTML/Forms ---

    {{LearnSidebar}}

    -

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

    +

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

    Необходимые условия

    diff --git a/files/ru/learn/forms/sending_and_retrieving_form_data/index.html b/files/ru/learn/forms/sending_and_retrieving_form_data/index.html index a0d9a129a7..f94ea65441 100644 --- a/files/ru/learn/forms/sending_and_retrieving_form_data/index.html +++ b/files/ru/learn/forms/sending_and_retrieving_form_data/index.html @@ -104,7 +104,7 @@ original_slug: Learn/HTML/Forms/Отправка_и_Получение_данн Host: foo.com
    -

    Заметка: Вы можете найти этот пример на GitHub — смотрите get-method.html (see it live also).

    +

    Заметка: вы можете найти этот пример на GitHub — смотрите get-method.html (see it live also).

    Метод POST

    @@ -139,12 +139,12 @@ say=Hi&to=Mom

    Заголовок Content-Length указывает размер тела, а заголовок Content-Type указывает тип данных, отправляемых на сервер. Мы обсудим эти заголовки позже.

    -

    Заметка: Вы можете найти этот пример на GitHub — смотрите post-method.html (see it live also).

    +

    Заметка: вы можете найти этот пример на GitHub — смотрите post-method.html (see it live also).

    Просмотр HTTP-запросов

    -

    HTTP-запросы никогда не отображаются пользователю (если вы хотите их видеть, Вам нужно использовать такие инструменты, как Firefox Network Monitor или Chrome Developer Tools). Например, данные формы можно увидеть на вкладке Сеть (Network) в Chrome следующим образом (после отправки формы):

    +

    HTTP-запросы никогда не отображаются пользователю (если вы хотите их видеть, вам нужно использовать такие инструменты, как Firefox Network Monitor или Chrome Developer Tools). Например, данные формы можно увидеть на вкладке Сеть (Network) в Chrome следующим образом (после отправки формы):

    1. Нажмите F12
    2. diff --git a/files/ru/learn/forms/your_first_form/index.html b/files/ru/learn/forms/your_first_form/index.html index c6dfa3b2b7..35a19f3a84 100644 --- a/files/ru/learn/forms/your_first_form/index.html +++ b/files/ru/learn/forms/your_first_form/index.html @@ -146,7 +146,7 @@ original_slug: Learn/HTML/Forms/Ваша_первая_HTML_форма
      -

      Примечание: Вы также можете использовать HTML-элемент {{HTMLElement("input")}} с соответствующим атрибутом type , чтобы создать кнопку:  <input type="submit">. Главным преимуществом HTML-элемента {{HTMLelement("button")}} в сравнении с элементом {{HTMLelement("input")}} заключается в том, что {{HTMLelement("input")}} может принимать в себя только простой текст, в то время как {{HTMLelement("button")}} позволяет использовать весь HTML для создания более стилизованного текста внутри кнопки.

      +

      Примечание: вы также можете использовать HTML-элемент {{HTMLElement("input")}} с соответствующим атрибутом type , чтобы создать кнопку:  <input type="submit">. Главным преимуществом HTML-элемента {{HTMLelement("button")}} в сравнении с элементом {{HTMLelement("input")}} заключается в том, что {{HTMLelement("input")}} может принимать в себя только простой текст, в то время как {{HTMLelement("button")}} позволяет использовать весь HTML для создания более стилизованного текста внутри кнопки.

      Базовая стилизация формы

      @@ -240,7 +240,7 @@ button {

      -

      Примечание: Вы можете найти код на GitHub в first-form-styled.html (также можно посмотреть код вживую).

      +

      Примечание: вы можете найти код на GitHub в first-form-styled.html (также можно посмотреть код вживую).

      Отправка данных на сервер

      diff --git a/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html b/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html index 399bedd3dd..6e24e6867a 100644 --- a/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html +++ b/files/ru/learn/getting_started_with_the_web/how_the_web_works/index.html @@ -74,7 +74,7 @@ translation_of: Learn/Getting_started_with_the_web/How_the_Web_works

      DNS

      -

      Реальные веб-адреса - неудобные, незапоминающиеся строки, которые Вы вводите в адресную строку, чтобы найти ваши любимые веб-сайты. Эти строки состоят из чисел, например: 63.245.215.20.

      +

      Реальные веб-адреса - неудобные, незапоминающиеся строки, которые вы вводите в адресную строку, чтобы найти ваши любимые веб-сайты. Эти строки состоят из чисел, например: 63.245.215.20.

      Такой набор чисел называется {{Glossary("IP Address", "IP-адресом")}} и представляет собой уникальное местоположение в Интернете. Впрочем, его не очень легко запомнить, правда? Вот почему изобрели DNS. Это специальные сервера, которые связывают веб-адрес, который вы вводите в браузере (например, "mozilla.org"), с реальным IP-адресом сайта.

      diff --git a/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html b/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html index 0d939084f5..f506a21200 100644 --- a/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html +++ b/files/ru/learn/getting_started_with_the_web/javascript_basics/index.html @@ -88,7 +88,7 @@ myHeading.textContent = 'Hello world!';
      -

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

      +

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

      diff --git a/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html b/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html index bf50ebe6c6..d487a9d40b 100644 --- a/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html +++ b/files/ru/learn/getting_started_with_the_web/publishing_your_website/index.html @@ -101,7 +101,7 @@ translation_of: Learn/Getting_started_with_the_web/Publishing_your_website

      -

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

      +

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

      У всех операционных систем есть командная строка:

      diff --git a/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html b/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html index 69be6b47d2..d44812d2c3 100644 --- a/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html +++ b/files/ru/learn/getting_started_with_the_web/what_will_your_website_look_like/index.html @@ -31,7 +31,7 @@ translation_of: Learn/Getting_started_with_the_web/What_will_your_website_look_l

      Для начала, вам будет нужно ответить на следующие вопросы:

        -
      1. О чем ваш веб-сайт? Вам нравятся собаки, Нью-Йорк или Pacman?
      2. +
      3. О чем ваш веб-сайт? вам нравятся собаки, Нью-Йорк или Pacman?
      4. Какую информацию вы предоставляете о предмете? Напишите заголовок и несколько абзацев, и подумайте над изображениями, которые вы хотите показать на своей странице.
      5. Как будет выглядеть ваш веб-сайт, в простых терминах высокого уровня. Какой цвет фона? Какой вид шрифта будет уместен: деловой, мультяшный, жирный и кричащий или тонкий?
      diff --git a/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html b/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html index 53778afe17..a3e50b3de2 100644 --- a/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html +++ b/files/ru/learn/html/introduction_to_html/advanced_text_formatting/index.html @@ -81,7 +81,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Advanced_text_formatting

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

      -

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

      +

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

    -

    Примечание: Вы также можете найти этот базовый пример HTML на  MDN Learning Area Github repo.

    +

    Примечание: вы также можете найти этот базовый пример HTML на  MDN Learning Area Github repo.

    Теперь можете открыть браузер и посмотреть, во что отрисовался код, а потом изменить его, обновить страницу и посмотреть, что получилось. Сначала страница выглядит так:

    diff --git a/files/ru/learn/html/introduction_to_html/index.html b/files/ru/learn/html/introduction_to_html/index.html index 9d847f1dfe..336321157d 100644 --- a/files/ru/learn/html/introduction_to_html/index.html +++ b/files/ru/learn/html/introduction_to_html/index.html @@ -18,7 +18,7 @@ original_slug: Learn/HTML/Введение_в_HTML ---
    {{LearnSidebar}}
    -

    По сути, {{glossary("HTML")}} довольно простой язык, состоящий из элементов, которые могут быть применены к частям текста, чтобы придавать им различные значения (Это абзац? Это маркированный список? Это часть таблицы?), разделять документ на логические секции (есть ли у документа шапка? три столбца с контентом? меню навигации?) и добавлять контент на Вашу страницу, такой как фото и видео. Этот модуль расскажет Вам о первых двух возможностях HTML и научит фундаментальным концепциям и синтаксису, которые вам нужно знать, чтобы понять HTML.

    +

    По сути, {{glossary("HTML")}} довольно простой язык, состоящий из элементов, которые могут быть применены к частям текста, чтобы придавать им различные значения (Это абзац? Это маркированный список? Это часть таблицы?), разделять документ на логические секции (есть ли у документа шапка? три столбца с контентом? меню навигации?) и добавлять контент на Вашу страницу, такой как фото и видео. Этот модуль расскажет вам о первых двух возможностях HTML и научит фундаментальным концепциям и синтаксису, которые вам нужно знать, чтобы понять HTML.

    Необходимые условия

    @@ -46,7 +46,7 @@ original_slug: Learn/HTML/Введение_в_HTML
    Структура документа и веб-сайта
    Помимо определения отдельных частей страницы (таких как "абзац" или "изображение"), HTML также используется для определения отдельных зон веб-сайта (таких как "шапка", "меню навигации",  "столбец с основным содержимым".) В этой статье рассматривается, как планировать базовую структуру веб-сайта и писать HTML для представления этой структуры.
    Отладка HTML
    -
    Писать на HTML хорошо, но что, если что-то идёт не так, и вы не можете найти место ошибки в коде? В этой статье вы познакомитесь с некоторыми инструментами, которые могут Вам помочь.
    +
    Писать на HTML хорошо, но что, если что-то идёт не так, и вы не можете найти место ошибки в коде? В этой статье вы познакомитесь с некоторыми инструментами, которые могут вам помочь.

    Оценка

    diff --git a/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html b/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html index f5a62ee916..744447d346 100644 --- a/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html +++ b/files/ru/learn/html/introduction_to_html/structuring_a_page_of_content/index.html @@ -83,7 +83,7 @@ original_slug: Learn/HTML/Введение_в_HTML/Structuring_a_page_of_content

    Оценивание

    -

    Если вам дали это задание на каком-то курсе, просто передайте свою страницу для проверки преподавателю. Если вы учитесь сами, обратитесь на форум, задав тему обсуждения этого упражнения, или в IRC-канале #mdn в IRC Mozilla, или в IRC-канале #mdn в IRC Mozilla. Попробуйте выполнить задание сами, ведь Вам некого обманывать, кроме себя самого!

    +

    Если вам дали это задание на каком-то курсе, просто передайте свою страницу для проверки преподавателю. Если вы учитесь сами, обратитесь на форум, задав тему обсуждения этого упражнения, или в IRC-канале #mdn в IRC Mozilla, или в IRC-канале #mdn в IRC Mozilla. Попробуйте выполнить задание сами, ведь вам некого обманывать, кроме себя самого!

    {{PreviousMenu("Learn/HTML/Introduction_to_HTML/Marking_up_a_letter", "Learn/HTML/Introduction_to_HTML")}}

    diff --git a/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html b/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html index 89995e889b..bf88afba9b 100644 --- a/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html +++ b/files/ru/learn/html/multimedia_and_embedding/adding_vector_graphics_to_the_web/index.html @@ -26,12 +26,12 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi
    -

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

    +

    Примечание: Данная статья не научит вас векторной графике, а даст понимание что это и как её использовать в веб-документах.

    Что такое векторная графика?

    -

    В веб-разработке Вы будете сталкиваться с двумя типами изображений - растровым и векторным:

    +

    В веб-разработке вы будете сталкиваться с двумя типами изображений - растровым и векторным:

    • Растровое изображение задаётся сеткой пикселей — файл растрового изображения содержит информацию о расположении и цвете каждого пикселя. Среди популярных форматов изображений данного типа числятся Bitmap (.bmp), PNG (.png), JPEG (.jpg) и GIF (.gif)
    • @@ -40,7 +40,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi

      Для демонстрации различий между типами изображений, давайте взглянем на пример. Вы можете найти данный пример на Github как vector-versus-raster.html — в нем демонстрируются два, на первый взгляд, одинаковых изображения, расположенных рядом друг с другом. Каждое из изображений представляет собой красную звезду с тенью. Различие их в том, что левое изображение имеет формат PNG, а правое - SVG.

      -

      Различия становятся заметны, когда Вы изменяете масштаб страницы — PNG изображение становится неровным (становятся видны пиксели), потому что оно содержит информацию о положении и цвете каждого пикселя. При увеличении каждый пиксель также увеличивается, охватывая несколько пикселей дисплея, поэтому становятся заметны "кирпичики". Векторное изображение продолжает выглядеть ровным и красивым, потому что фигуры, масштабируются совместно с ним. 

      +

      Различия становятся заметны, когда вы изменяете масштаб страницы — PNG изображение становится неровным (становятся видны пиксели), потому что оно содержит информацию о положении и цвете каждого пикселя. При увеличении каждый пиксель также увеличивается, охватывая несколько пикселей дисплея, поэтому становятся заметны "кирпичики". Векторное изображение продолжает выглядеть ровным и красивым, потому что фигуры, масштабируются совместно с ним. 

      Two star images

      @@ -54,7 +54,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/Добавление_r_graphi

      Что такое SVG?

      -

      SVG это язык на базе {{glossary("XML")}} для описания векторных изображений. По сути это язык разметки, как и HTML, только содержащий множество различных элементов для определения фигур вашего изображения, а также параметров их отображения. SVG предназначен для разметки графики, а не содержимого. В простейшем случае,  Вы можете использовать элементы для создания простых фигур, таких как {{svgelement("circle")}}(круг) и {{svgelement("rect")}}(прямоугольник). Более сложные SVG элементы включают {{svgelement("feColorMatrix")}} (разложение цвета с использованием матрицы), {{svgelement("animate")}} (анимация частей Вашего векторного изображения) и {{svgelement("mask")}} (применение маски к изображению.)

      +

      SVG это язык на базе {{glossary("XML")}} для описания векторных изображений. По сути это язык разметки, как и HTML, только содержащий множество различных элементов для определения фигур вашего изображения, а также параметров их отображения. SVG предназначен для разметки графики, а не содержимого. В простейшем случае,  вы можете использовать элементы для создания простых фигур, таких как {{svgelement("circle")}}(круг) и {{svgelement("rect")}}(прямоугольник). Более сложные SVG элементы включают {{svgelement("feColorMatrix")}} (разложение цвета с использованием матрицы), {{svgelement("animate")}} (анимация частей вашего векторного изображения) и {{svgelement("mask")}} (применение маски к изображению.)

      В качестве простого примера, следующий код создаёт круг и прямоугольник:

      @@ -191,7 +191,7 @@ background-size: contain;

      В этом разделе активного изучения мы бы хотели, чтобы вы просто попробовали поиграть с SVG. Ниже, в области Input, вы увидите, что мы уже предоставили некий пример для того, чтобы вы начали. А ещё вы можете посетить SVG Element Reference, чтобы узнать больше деталей о других игрушках, которые могут быть использованы в SVG, и тоже попробовать их. Этот раздел полностью посвящён практике ваших исследовательских навыков и вашему развлечению.

      -

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

      +

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

      -

      Примечание: Вы можете найти готовый пример этого раздела, размещённый на Github (смотрите также исходный код).

      +

      Примечание: вы можете найти готовый пример этого раздела, размещённый на Github (смотрите также исходный код).

      Альтернативный текст

      @@ -351,7 +351,7 @@ window.addEventListener("load", drawOutput);

      Итог: если изображение имеет важность, в контексте содержимого вашей страницы, вам следует использовать HTML изображения. Если же картинка является банальной декорацией, используйте фоновые изображения CSS.

      -

      Замечание: Вы можете узнать больше о фоновых изображениях CSS в нашей теме о CSS.

      +

      Замечание: вы можете узнать больше о фоновых изображениях CSS в нашей теме о CSS.

      Проверьте свои навыки!

      diff --git a/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html b/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html index bfb1efb19a..9e7390b2f6 100644 --- a/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html +++ b/files/ru/learn/html/multimedia_and_embedding/mozilla_splash_page/index.html @@ -35,7 +35,7 @@ original_slug: Learn/HTML/Multimedia_and_embedding/заставка_Mozilla

      Описание проекта

      -

      В этом задании мы представляем вам почти законченный сайт-визитку Mozilla, цель которого - рассказать что-нибудь интересное о принципах Mozilla и предоставить несколько ссылок для углублённого ознакомления. К сожалению, изображения или видео не добавлены - это ваша работа! Вам нужно добавить несколько медиа-файлов для того, чтобы страница смотрелась лучше и имела больше смысла. В следующих подразделах подробно объяснено, что вам требуется сделать:

      +

      В этом задании мы представляем вам почти законченный сайт-визитку Mozilla, цель которого - рассказать что-нибудь интересное о принципах Mozilla и предоставить несколько ссылок для углублённого ознакомления. К сожалению, изображения или видео не добавлены - это ваша работа! Вам нужно добавить несколько медиа-файлов для того, чтобы страница смотрелась лучше и имела больше смысла. В следующих подразделах подробно объяснено, что вам требуется сделать:

      Подготовка изображений

      diff --git a/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html b/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html index 64852c2c4d..60f7bb93db 100644 --- a/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html +++ b/files/ru/learn/html/multimedia_and_embedding/other_embedding_technologies/index.html @@ -264,7 +264,7 @@ textarea.onkeyup = function(){

      {{Glossary("CSP")}} означает политику безопасности контента и обеспечивает набор заголовков HTTP (метаданные, отправленные вместе с вашими веб-страницами, когда они обслуживаются с веб-сервера), предназначенных для улучшения безопасности вашего HTML-документа. Когда дело доходит до обеспечения безопасности <iframe>, вы можете настроить сервер для отправки соответствующего X-Frame-Options  заголовка. Это может помешать другим веб-сайтам встраивать ваш контент на их веб-страницы (что позволило бы использовать {{interwiki('wikipedia','clickjacking')}} и множество других атак), что и было сделано разработчиками MDN, как мы видели ранее..

      -

      Примечание: Вы можете прочитать пост Фредерика Брауна On the X-Frame-Options Security Header для более детальной информации по теме. Разумеется, объяснение в этой статье далеко не полное.

      +

      Примечание: вы можете прочитать пост Фредерика Брауна On the X-Frame-Options Security Header для более детальной информации по теме. Разумеется, объяснение в этой статье далеко не полное.

      Элементы <embed> и <object>

      diff --git a/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html b/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html index 800b73074d..9a1932d070 100644 --- a/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html +++ b/files/ru/learn/html/multimedia_and_embedding/responsive_images/index.html @@ -173,7 +173,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Responsive_images

      Our example site as viewed on a wide screen - here the first image works ok, as it is big enough to see the detail in the center.Our example site as viewed on a narrow screen with the picture element used to switch the first image to a portrait close up of the detail, making it a lot more useful on a narrow screen

      -

      Примечание: Вам следует использовать атрибут media только при художественном оформлении; когда вы используете media, не применяйте медиа-условия с атрибутом sizes.

      +

      Примечание: вам следует использовать атрибут media только при художественном оформлении; когда вы используете media, не применяйте медиа-условия с атрибутом sizes.

      Почему это нельзя сделать посредством CSS и JavaScript?

      diff --git a/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html b/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html index ea22755f55..4176f00fcc 100644 --- a/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html +++ b/files/ru/learn/html/multimedia_and_embedding/video_and_audio_content/index.html @@ -168,7 +168,7 @@ translation_of: Learn/HTML/Multimedia_and_embedding/Video_and_audio_content

      A simple audio player with a play button, timer, volume control, and progress bar

      -

      Примечание: Вы можете запустить аудио-демо в Github (см. также исходный код аудиоплеера.)

      +

      Примечание: вы можете запустить аудио-демо в Github (см. также исходный код аудиоплеера.)

      Он занимает меньше места, чем видеоплеер, поскольку нет визуального компонента - вам просто нужно отображать элементы управления для воспроизведения звука. Другие отличия от видео HTML5 заключаются в следующем:

      diff --git a/files/ru/learn/html/tables/advanced/index.html b/files/ru/learn/html/tables/advanced/index.html index f10ce90fe7..3011f8b9cf 100644 --- a/files/ru/learn/html/tables/advanced/index.html +++ b/files/ru/learn/html/tables/advanced/index.html @@ -435,7 +435,7 @@ tfoot {
      -

      Примечание: Вы можете проверить как работает последние примеры здесь items-sold-scope.html (also see this live) и items-sold-headers.html (see this live too).

      +

      Примечание: вы можете проверить как работает последние примеры здесь items-sold-scope.html (also see this live) и items-sold-headers.html (see this live too).

      Заключение

      diff --git a/files/ru/learn/html/tables/basics/index.html b/files/ru/learn/html/tables/basics/index.html index e90650110a..a87d4503a0 100644 --- a/files/ru/learn/html/tables/basics/index.html +++ b/files/ru/learn/html/tables/basics/index.html @@ -120,7 +120,7 @@ translation_of: Learn/HTML/Tables/Basics
    • Таблицы не реагируют автоматически на тип устройства: У надлежащих контейнеров (например, {{htmlelement("header")}}, {{htmlelement("section")}}, {{htmlelement("article")}}, или {{htmlelement("div")}}) ширина по умолчанию равна 100% от их родительского элемента. У таблиц же размер по умолчанию подстраивается под их содержимое, так что чтобы они одинаково хорошо работали на разных типах устройств необходимо принимать дополнительные меры.
    • -

      Упражнение: Ваша первая таблица

      +

      Упражнение: ваша первая таблица

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

      diff --git a/files/ru/learn/javascript/asynchronous/async_await/index.html b/files/ru/learn/javascript/asynchronous/async_await/index.html index 9f42afb02e..c6c6efe796 100644 --- a/files/ru/learn/javascript/asynchronous/async_await/index.html +++ b/files/ru/learn/javascript/asynchronous/async_await/index.html @@ -300,7 +300,7 @@ displayContent()

      Async/await позволяет вам писать код в синхронном стиле. Ключевое слово await блокирует приостанавливает выполнение ptomise-based функции до того момента, пока promise примет статус fulfilled. Это не блокирует код за пределами вашей асинхронной функции, тем не менее важно помнить, что внутри асинхронной функции поток выполнения блокируется.

      - Ваш код может стать медленнее за счёт большого количества awaited promises, которые идут один за другим. Каждый await должен дождаться выполнения предыдущего, тогда как на самом деле мы хотим, чтобы наши Promises выполнялись одновременно, как если бы мы не использовали async/await.
      + ваш код может стать медленнее за счёт большого количества awaited promises, которые идут один за другим. Каждый await должен дождаться выполнения предыдущего, тогда как на самом деле мы хотим, чтобы наши Promises выполнялись одновременно, как если бы мы не использовали async/await.

      Есть подход, который позволяет обойти эту проблему - сохранить все выполняющиеся Promises в переменные, а уже после этого дожидаться (awaiting) их результата. Давайте посмотрим на несколько примеров.

      diff --git a/files/ru/learn/javascript/asynchronous/introducing/index.html b/files/ru/learn/javascript/asynchronous/introducing/index.html index e6233c7904..36a4d6f9cd 100644 --- a/files/ru/learn/javascript/asynchronous/introducing/index.html +++ b/files/ru/learn/javascript/asynchronous/introducing/index.html @@ -158,7 +158,7 @@ gods.forEach(function (eachName, index){ });
      -

      Заметка: Вы можете посмотреть законченную версию на github (посмотрите исходный код и запустите пример).

      +

      Заметка: вы можете посмотреть законченную версию на github (посмотрите исходный код и запустите пример).

      В примере видно, как fetch() принимает один параметр — URL ресурса, который нужно  получить из сети, — и возвращает промис. Промис или обещание — это объект, представляющий асинхронную операцию, выполненную удачно или неудачно. Он представляет собой как бы промежуточное состояние. По сути, это способ браузера сказать: "я обещаю вернуться к вам с ответом как можно скорее," отсюда и название "обещание."

      @@ -171,7 +171,7 @@ gods.forEach(function (eachName, index){
    -

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

    +

    Заметка: вы узнаете намного больше о promise позже в этом модуле, так что не волнуйтесь если вы что-нибудь не поняли.

    Очередь событий

    diff --git a/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html b/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html index dbc80a38c0..50550da46a 100644 --- a/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html +++ b/files/ru/learn/javascript/asynchronous/timeouts_and_intervals/index.html @@ -41,7 +41,7 @@ original_slug: Learn/JavaScript/Asynchronous/Таймауты_и_интерва

    Асинхронный код, установленный этими функциями, выполняется в основном потоке (по истечении указанного им таймера).

    -

    Важно знать, что вы можете (и часто будете) запускать другой код до выполнения вызова setTimeout () или между итерациями setInterval (). В зависимости от того, насколько интенсивно используются эти операции для процессора, они могут ещё больше задержать выполнение асинхронного кода, поскольку любой асинхронный код будет выполняться только после того, как станет доступен основной поток. (Другими словами, когда стек пуст.) Вы узнаете больше по этому вопросу по мере изучения этой статьи.

    +

    Важно знать, что вы можете (и часто будете) запускать другой код до выполнения вызова setTimeout () или между итерациями setInterval (). В зависимости от того, насколько интенсивно используются эти операции для процессора, они могут ещё больше задержать выполнение асинхронного кода, поскольку любой асинхронный код будет выполняться только после того, как станет доступен основной поток. (Другими словами, когда стек пуст.) вы узнаете больше по этому вопросу по мере изучения этой статьи.

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

    @@ -238,7 +238,7 @@ alert('Hello');

    Он был создан в ответ на проблемы с setInterval (), который, например, не работает с частотой кадров, оптимизированной для устройства, иногда пропускает кадры, продолжает работать, даже если вкладка не является активной вкладкой или анимация прокручивается со страницы и т. д.(Читай об этом больше в CreativeJS.)

    -

    Note: Вы можете найти примеры использования requestAnimationFrame() в этом курсе — например в  Рисование графики, and Практика построения объектов.

    +

    Note: вы можете найти примеры использования requestAnimationFrame() в этом курсе — например в  Рисование графики, and Практика построения объектов.

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

    @@ -408,7 +408,7 @@ let rAF;
    -

    Note: Вы можете посмотреть рабочий образец на GitHub. ( исходный код.)

    +

    Note: вы можете посмотреть рабочий образец на GitHub. ( исходный код.)

    Очистка вызова  requestAnimationFrame() 

    @@ -559,7 +559,7 @@ function start() { }
    -

    Note: Вы увидите, что этот пример вызывает setTimeout() без сохранения возвращаемого значения. (не  let myTimeout = setTimeout(functionName, interval).) 

    +

    Note: вы увидите, что этот пример вызывает setTimeout() без сохранения возвращаемого значения. (не  let myTimeout = setTimeout(functionName, interval).) 

    Это прекрасно работает, если вам не нужно очищать интервал / тайм-аут в любой момент. Если вы это сделаете, вам нужно будет сохранить возвращённый идентификатор!

    diff --git a/files/ru/learn/javascript/building_blocks/build_your_own_function/index.html b/files/ru/learn/javascript/building_blocks/build_your_own_function/index.html index b4fb0a262a..d374728766 100644 --- a/files/ru/learn/javascript/building_blocks/build_your_own_function/index.html +++ b/files/ru/learn/javascript/building_blocks/build_your_own_function/index.html @@ -242,7 +242,7 @@ displayMessage('Brian: Hi there, how are you today?','chat');

    В этом модуле

      -
    • Принятие решений в Вашем коде — условные конструкции
    • +
    • Принятие решений в вашем коде — условные конструкции
    • Зацикливание кода
    • Функции — Переиспользуемые блоки кода
    • Создайте свою собственную функцию
    • diff --git a/files/ru/learn/javascript/building_blocks/conditionals/index.html b/files/ru/learn/javascript/building_blocks/conditionals/index.html index 202eaaa9e2..ce8509be0e 100644 --- a/files/ru/learn/javascript/building_blocks/conditionals/index.html +++ b/files/ru/learn/javascript/building_blocks/conditionals/index.html @@ -1,5 +1,5 @@ --- -title: Принятие решений в Вашем коде — условные конструкции +title: Принятие решений в вашем коде — условные конструкции slug: Learn/JavaScript/Building_blocks/conditionals tags: - JavaScript @@ -96,7 +96,7 @@ if (shoppingDone === true) {

      В этом коде, как показано, всегда будет shoppingDone равный false, что означает разочарование для нашего бедного ребёнка. Мы должны предоставить механизм для родителя, чтобы установить для переменной shoppingDone значение  true , если ребёнок помог с покупками.

      -

      Примечание: Вы можете увидеть больше в полной версии этого примера на GitHub (также посмотреть как он работает вживую.)

      +

      Примечание: вы можете увидеть больше в полной версии этого примера на GitHub (также посмотреть как он работает вживую.)

      else if

      @@ -149,7 +149,7 @@ function setWeather() {

      Примечание об операторах сравнения

      @@ -202,7 +202,7 @@ if (shoppingDone) { // не нужно явно указывать '=== true'

      Логические операторы: И, ИЛИ и НЕ

      -

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

      +

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

      • && — И; позволяет объединить два или более выражения так, что каждое из них отдельно должно иметь значение true , чтобы в итоге общее выражение имело значение true.
      • @@ -338,7 +338,7 @@ function setWeather() {

        {{ EmbedLiveSample('Пример_оператора_switch', '100%', 100) }}

        -

        Note: Вы можете найти этот пример на GitHub (также увидеть как он работает.)

        +

        Note: вы можете найти этот пример на GitHub (также увидеть как он работает.)

        Тернарный оператор

        @@ -349,7 +349,7 @@ function setWeather() {

        Приведём простой пример:

        -
        var greeting = ( isBirthday ) ? 'С днём рождения, г-н Кузнецов! Хорошо Вам повеселиться!' : 'Доброе утро, г-н Кузнецов.';
        +
        var greeting = ( isBirthday ) ? 'С днём рождения, г-н Кузнецов! Хорошо вам повеселиться!' : 'Доброе утро, г-н Кузнецов.';

        У нас есть переменная isBirthday , если она true, мы отправляем посетителю поздравление с днём рождения; если нет – выдаём стандартное приветствие.

        @@ -386,7 +386,7 @@ select.onchange = function() {

        Наконец, у нас есть обработчик событий onchange , использующийся для запуска функции, содержащей тернарный оператор. Сначала она проверяет условие — select.value === 'black'. Если возвращается true, мы запускаем функцию update() с параметрами чёрного и белого, в результате чего получаем чёрный цвет фона и белый цвет текста. Если возвращается false, мы запускаем функцию update() с параметрами белого и чёрного, в результате чего цвета веб-сайта меняются на противоположные.

        -

        Note: Вы можете найти этот пример на GitHub (также увидеть как он работает.)

        +

        Note: вы можете найти этот пример на GitHub (также увидеть как он работает.)

        Практическое упражнение: простой календарь

        diff --git a/files/ru/learn/javascript/building_blocks/events/index.html b/files/ru/learn/javascript/building_blocks/events/index.html index 5e9e1050a4..0176c9a063 100644 --- a/files/ru/learn/javascript/building_blocks/events/index.html +++ b/files/ru/learn/javascript/building_blocks/events/index.html @@ -112,7 +112,7 @@ btn.onclick = function() {

        В данной ситуации свойство onclick — это свойство обработчика события. В принципе это обычное свойство кнопки как элемента (наравне с btn.textContent или btn.style), но оно относится к особому типу. Если вы установите его равным какому-нибудь коду, этот код будет запущен при возникновении события (при нажатии на кнопку).

        -

        Для получения того же результата, Вы также можете присвоить свойству обработчика имя уже описанной функции (как мы видели в статье Создайте свою функцию):

        +

        Для получения того же результата, вы также можете присвоить свойству обработчика имя уже описанной функции (как мы видели в статье Создайте свою функцию):

        const btn = document.querySelector('button');
         
        @@ -149,7 +149,7 @@ btn.onclick = bgChange;
        }
        -

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

        +

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

        Значение атрибута —  это буквально код JavaScript, который вы хотите запустить при возникновении события. В приведённом выше примере вызывается функция, определённая внутри элемента {{htmlelement ("script")}} на той же странице, но вы также можете вставить JavaScript непосредственно внутри атрибута, например:

        @@ -160,7 +160,7 @@ btn.onclick = bgChange;

        Более того, не рекомендуется смешивать HTML и JavaScript файлы, так как в дальнейшем такой код становится сложнее с точки зрения обработки (парсинга). Лучше держать весь JavaScript в одном месте. Также, если он находится в отдельном файле, вы можете применить его к нескольким документам HTML.

        -

        Даже при работе только в одном файле использование встроенных обработчиков не является хорошей идеей. Ладно, если у Вас одна кнопка, но что, если у вас их 100? Вам нужно добавить в файл 100 атрибутов; обслуживание такого кода очень быстро превратится в кошмар. С помощью JavaScript вы можете легко добавить функцию обработчика событий ко всем кнопкам на странице независимо от того, сколько их было.

        +

        Даже при работе только в одном файле использование встроенных обработчиков не является хорошей идеей. Ладно, если у вас одна кнопка, но что, если у вас их 100? Вам нужно добавить в файл 100 атрибутов; обслуживание такого кода очень быстро превратится в кошмар. С помощью JavaScript вы можете легко добавить функцию обработчика событий ко всем кнопкам на странице независимо от того, сколько их было.

        Например:

        @@ -177,7 +177,7 @@ for (var i = 0; i < buttons.length; i++) { });
        -

        Примечание: Разделение логики Вашей программы и Вашего контента также делает Ваш сайт более дружественным к поисковым системам.

        +

        Примечание: Разделение логики вашей программы и вашего контента также делает ваш сайт более дружественным к поисковым системам.

        Функции addEventListener() и removeEventListener()

        @@ -194,7 +194,7 @@ function bgChange() { btn.addEventListener('click', bgChange);
        -

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

        +

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

        Внутри функции addEventListener() мы указываем два параметра — имя события, для которого мы хотим зарегистрировать этот обработчик, и код, содержащий функцию обработчика, которую мы хотим запустить в ответ. Обратите внимание, что будет целесообразно поместить весь код внутри функции addEventListener() в анонимную функцию, например:

        @@ -262,7 +262,7 @@ etc. btn.addEventListener('click', bgChange);
        -

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

        +

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

        Итак в коде выше мы включаем объект события e в функцию, а в функции — настройку стиля фона для e.target, который является кнопкой. Свойство объекта события target всегда является ссылкой на элемент, с которым только что произошло событие. Поэтому в этом примере мы устанавливаем случайный цвет фона на кнопке, а не на странице.

        @@ -591,7 +591,7 @@ video.onclick = function() {

        В этом модуле

          -
        • Принятие решений в Вашем коде — условные конструкции
        • +
        • Принятие решений в вашем коде — условные конструкции
        • Зацикливание кода
        • Функции — Переиспользуемые блоки кода
        • Создайте свою собственную функцию
        • diff --git a/files/ru/learn/javascript/building_blocks/functions/index.html b/files/ru/learn/javascript/building_blocks/functions/index.html index b48d642112..0db2a14713 100644 --- a/files/ru/learn/javascript/building_blocks/functions/index.html +++ b/files/ru/learn/javascript/building_blocks/functions/index.html @@ -31,9 +31,9 @@ translation_of: Learn/JavaScript/Building_blocks/Functions

          Где можно встретить функции?

          -

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

          +

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

          -

          В значительном количестве случаев, когда вы пользуетесь структурой JavaScript, в которой есть пара обычных скобок — () — и при этом, это не является структурой типа цикл for , while, или do...while цикл, или if...else конструкция, Вы используете функцию.

          +

          В значительном количестве случаев, когда вы пользуетесь структурой JavaScript, в которой есть пара обычных скобок — () — и при этом, это не является структурой типа цикл for , while, или do...while цикл, или if...else конструкция, вы используете функцию.

          Встроенные функции браузера

          @@ -64,7 +64,7 @@ console.log(madeAString);

          ...мы использовали функции!

          -

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

          +

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

          Фактически, часть кода, который вы вызываете, когда ссылаетесь на встроенную функцию браузера  (воображаемое слово для её запуска или выполнения), не может быть написана на JavaScript — многие из этих функций вызывают части фонового кода браузера, который написан в основном на системных языках низкого уровня, таких как C ++, а не на веб-языках, таких как JavaScript.

          @@ -258,7 +258,7 @@ function greeting() {
        • Откройте пример в браузере и в текстовом редакторе.
        • Откройте консоль JavaScript в инструментах разработчика вашего браузера. В консоли JavaScript введите следующую команду:
          output(x);
          - Вы должны увидеть значение переменной x вывод на экране.
        • + вы должны увидеть значение переменной x вывод на экране.
        • Теперь попробуйте ввести следующее в консоли
          output(y);
           output(z);
          @@ -277,7 +277,7 @@ function b() {
          a();
           b();
          - Вы должны увидеть значения y и z, выводимые на странице. Это отлично работает, так как функция output() вызывается внутри других функций - в той же области, где переменные, которые она печатает, определяются в каждом случае. output() доступен из любого места, поскольку он определён в глобальной области.
        • + вы должны увидеть значения y и z, выводимые на странице. Это отлично работает, так как функция output() вызывается внутри других функций - в той же области, где переменные, которые она печатает, определяются в каждом случае. output() доступен из любого места, поскольку он определён в глобальной области.
        • Теперь попробуйте обновить свой код следующим образом:
          function a() {
             var y = 2;
          diff --git a/files/ru/learn/javascript/building_blocks/image_gallery/index.html b/files/ru/learn/javascript/building_blocks/image_gallery/index.html
          index e79c0d26db..e012778615 100644
          --- a/files/ru/learn/javascript/building_blocks/image_gallery/index.html
          +++ b/files/ru/learn/javascript/building_blocks/image_gallery/index.html
          @@ -35,7 +35,7 @@ translation_of: Learn/JavaScript/Building_blocks/Image_gallery
           

          Для начала скачайте ZIP файл для примера и распакуйте его содержимое у себя на компьютере.

          -

          Замечание: Вы также можете использовать такие сайты как    JSBin или Thimble для выполнения задания. Вы можете скопировать HTML, CSS и JavaScript в один из этих редакторов. Если онлайн редактор, который вы выбрали, не имеет отдельных панелей для JavaScript/CSS, вы можете выставить код в теги <script>/<style> расположенные на самой HTML странице.

          +

          Замечание: вы также можете использовать такие сайты как    JSBin или Thimble для выполнения задания. Вы можете скопировать HTML, CSS и JavaScript в один из этих редакторов. Если онлайн редактор, который вы выбрали, не имеет отдельных панелей для JavaScript/CSS, вы можете выставить код в теги <script>/<style> расположенные на самой HTML странице.

          Обзор проекта

          @@ -136,7 +136,7 @@ overlay.style.backgroundColor = xxx;

          В этом модуле

            -
          • Принятие решений в Вашем коде — условные конструкции
          • +
          • Принятие решений в вашем коде — условные конструкции
          • Зацикливание кода
          • Функции — Переиспользуемые блоки кода
          • Создайте свою собственную функцию
          • diff --git a/files/ru/learn/javascript/building_blocks/index.html b/files/ru/learn/javascript/building_blocks/index.html index cdcc1fbb95..cb6032224b 100644 --- a/files/ru/learn/javascript/building_blocks/index.html +++ b/files/ru/learn/javascript/building_blocks/index.html @@ -24,20 +24,20 @@ translation_of: Learn/JavaScript/Building_blocks ---
            {{LearnSidebar}}
            -

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

            +

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

            Предварительное условие

            -

            До начала изучения следующего раздела Вам нужно тщательно ознакомиться с основами HTML и CSS, так же обязательно прочтите курс "Первые шаги в JavaScript".

            +

            До начала изучения следующего раздела вам нужно тщательно ознакомиться с основами HTML и CSS, так же обязательно прочтите курс "Первые шаги в JavaScript".

            -

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

            +

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

            Руководства

            -
            Принятие решений в Вашем коде — условные конструкции
            +
            Принятие решений в вашем коде — условные конструкции
            В любом языке программирования необходимо принимать решения и совершать действия в зависимости от полученных в процессе исполнения программы или введённых пользователем данных. Например, игра должна завершиться, когда число жизней персонажа игрока достигает нуля. В приложении для прогноза погоды отображается картинка с восходящим солнцем, если смотреть утром, со звёздами и луной — ночью. В данной статье исследуется работа условных конструкций в JavaScript.
            Зацикливание кода
            Иногда требуется, чтобы действие исполнялось несколько раз подряд. Например, при просмотре списка имён. В программировании для данной цели успешно применяются циклы.  Здесь мы познакомимся с использованием циклов в JavaScript.
            @@ -46,14 +46,14 @@ translation_of: Learn/JavaScript/Building_blocks
            Создай свою функцию
            В отличие от большинства предыдущих статей,  рассматривающих только теорию, эта статья даёт практический опыт. Здесь вы получите практику создания собственных функций. На ряду с возможностями, мы также объясним дополнительные полезные подробности, связанные с функциями.
            Функции возвращают значения
            -
            Есть одно из существенных понятий для нас, представленное в этом курсе, которое достойно пристального внимания — возврат значений функции. Некоторые функции не возвращают значений после завершения,  но другие делают это. Главное понять, что это за значения, как использовать их в Вашем коде, и как заставить Вашу собственную функцию возвратить необходимые значения. 
            +
            Есть одно из существенных понятий для нас, представленное в этом курсе, которое достойно пристального внимания — возврат значений функции. Некоторые функции не возвращают значений после завершения,  но другие делают это. Главное понять, что это за значения, как использовать их в вашем коде, и как заставить Вашу собственную функцию возвратить необходимые значения. 
            Введение в события
            -
            События — это действия или явления, которые происходят в системе во время программирования, о которых система сообщает, и, при желании, на которые можно ответить. Например, когда пользователь кликает на кнопку на странице, возможно Вы захотите вывести на экран блок с информацией, как ответ на это событие. В последней статье мы обсудим важные концепции, связанные с событиями, и увидим, как они работают в браузерах.
            +
            События — это действия или явления, которые происходят в системе во время программирования, о которых система сообщает, и, при желании, на которые можно ответить. Например, когда пользователь кликает на кнопку на странице, возможно вы захотите вывести на экран блок с информацией, как ответ на это событие. В последней статье мы обсудим важные концепции, связанные с событиями, и увидим, как они работают в браузерах.

            Проверка знаний

            -

            Следующая оценка проверит Ваше понимание основ JavaScript, описанных в данном руководстве.

            +

            Следующая оценка проверит ваше понимание основ JavaScript, описанных в данном руководстве.

            Фотогалерея
            diff --git a/files/ru/learn/javascript/building_blocks/looping_code/index.html b/files/ru/learn/javascript/building_blocks/looping_code/index.html index 08e8ccc1c1..b6d8eaf8fd 100644 --- a/files/ru/learn/javascript/building_blocks/looping_code/index.html +++ b/files/ru/learn/javascript/building_blocks/looping_code/index.html @@ -231,7 +231,7 @@ para.textContent = info;

            {{ EmbedLiveSample('Hidden_code_2', '100%', 60) }}

            -

            Заметка: Вы можете найти этот  пример на GitHub или  посмотреть онлайн.

            +

            Заметка: вы можете найти этот  пример на GitHub или  посмотреть онлайн.

            Здесь показан цикл, используемый для перебора элементов в массиве и выполнения определённых действий с каждым из них — очень распространённый шаблон в JavaScript
            @@ -275,7 +275,7 @@ para.textContent = info; }

            -

            Заметка: Вы можете найти этот пример на GitHub или посмотреть онлайн.

            +

            Заметка: вы можете найти этот пример на GitHub или посмотреть онлайн.

            @@ -384,7 +384,7 @@ btn.addEventListener('click', function() {
            -

            Заметка: Вы можете посмотреть исходный код на GitHub  или запустить его (also see it running live).

            +

            Заметка: вы можете посмотреть исходный код на GitHub  или запустить его (also see it running live).

            Пропуск итераций с продолжением

            @@ -728,7 +728,7 @@ textarea.onkeyup = function(){

            Мы уже предоставили вам:

              -
            • var i = 0; — Ваш инициализатор.
            • +
            • var i = 0; — ваш инициализатор.
            • refused.textContent += — начало строки, которая объединит что-то до конца refused.textContent.
            • admitted.textContent += — начало строки, которая объединит что-то до конца admitted.textContent.
            @@ -926,7 +926,7 @@ do {

            В этом модуле

              -
            • Принятие решений в Вашем коде — условные конструкции
            • +
            • Принятие решений в вашем коде — условные конструкции
            • Зацикливание кода
            • Функции — Переиспользуемые блоки кода
            • Создайте свою собственную функцию
            • diff --git a/files/ru/learn/javascript/building_blocks/return_values/index.html b/files/ru/learn/javascript/building_blocks/return_values/index.html index 9ff812f4a1..05463f3c21 100644 --- a/files/ru/learn/javascript/building_blocks/return_values/index.html +++ b/files/ru/learn/javascript/building_blocks/return_values/index.html @@ -37,7 +37,7 @@ console.log(newString);

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

              -

              Если Вы посмотрите на функцию replace() на MDN reference page, вы увидите секцию под названием Return value.  Очень важно знать и понимать какие значения возвращаются функциями, так что мы пытаемся включать эту информацию везде, где это возможно.

              +

              Если вы посмотрите на функцию replace() на MDN reference page, вы увидите секцию под названием Return value.  Очень важно знать и понимать какие значения возвращаются функциями, так что мы пытаемся включать эту информацию везде, где это возможно.

              Некоторые функции не возвращают значения( на наших reference pages, возвращаемое значение обозначено как void или undefined в таких случаях). Например, в функции displayMessage() которую мы сделали в прошлой статье, в результате выполнения функции не возвращается никакого значения. Функция всего лишь отображает что-то где-то на экране.

              @@ -90,7 +90,7 @@ console.log(newString);

              Теперь напишем нашу собственную возвращающую значение функцию.

                -
              1. Первым делом, сделайте локальную копию файла function-library.html из GitHub. Это простая HTML страничка, содержащая текстовое поле {{htmlelement("input")}} и параграф Также там есть элемент {{htmlelement("script")}} в котором мы храним в 2ух переменных ссылки на оба HTML элемента. Это маленькая страничка позволит Вам ввести число в text box и отобразит различные, относящиеся к нему числа в параграфе ниже.
              2. +
              3. Первым делом, сделайте локальную копию файла function-library.html из GitHub. Это простая HTML страничка, содержащая текстовое поле {{htmlelement("input")}} и параграф Также там есть элемент {{htmlelement("script")}} в котором мы храним в 2ух переменных ссылки на оба HTML элемента. Это маленькая страничка позволит вам ввести число в text box и отобразит различные, относящиеся к нему числа в параграфе ниже.
              4. Теперь добавим несколько полезных функций в элемент <script> . Ниже двух существующих строчек JavaScript, добавьте следующие описания функций:
                function squared(num) {
                   return num * num;
                @@ -127,7 +127,7 @@ function factorial(num) {
                   

                Далее мы делаем условный тест — если введённое значение не является числом, мы выводим в параграф сообщение об ошибке . Тест смотрит возвращает ли выражение isNaN(num)  true. Мы используем функцию isNaN() чтобы проверить что значение переменной num не число — если так то функция возвращаетtrue, если нет- false.

              5. -

                Если тест возвращает false, значение переменной numчисло, и поэтому мы выводим сообщение внутри параграфа о значениях квадрата, куба и факториала числа. Предложение вызывает  функции squared(), cubed() иfactorial() чтобы получить нужные значения. Сохраните Ваш код, загрузите его в браузере и посмотрите на то что получилось.

                +

                Если тест возвращает false, значение переменной numчисло, и поэтому мы выводим сообщение внутри параграфа о значениях квадрата, куба и факториала числа. Предложение вызывает  функции squared(), cubed() иfactorial() чтобы получить нужные значения. Сохраните ваш код, загрузите его в браузере и посмотрите на то что получилось.

              @@ -140,8 +140,8 @@ function factorial(num) {

              Это упражнение привнесло парочку важных понятий в изучении того, как использовать ключевое слово return . В дополнение:

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

              Заключение

              diff --git a/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html b/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html index d956d7bbc3..59da6482ed 100644 --- a/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html +++ b/files/ru/learn/javascript/building_blocks/test_your_skills_colon__functions/index.html @@ -13,7 +13,7 @@ translation_of: 'Learn/JavaScript/Building_blocks/Test_your_skills:_Functions'

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

              -

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

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

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

              diff --git a/files/ru/learn/javascript/client-side_web_apis/index.html b/files/ru/learn/javascript/client-side_web_apis/index.html index ed8a1b0a19..3186330fe0 100644 --- a/files/ru/learn/javascript/client-side_web_apis/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/index.html @@ -21,7 +21,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs ---
              {{LearnSidebar}}
              -

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

              +

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

              Прежде чем начать

              @@ -39,7 +39,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs
              Введение в различные web API
              Прежде всего, мы начнём изучение API с основ - что это такое, как это работает, как вы используете их в своём коде и как они структурированы? Мы также рассмотрим, что представляют собой различные основные классы API, и как их можно использовать.
              Управление документами
              -
              При написании веб-страниц и приложений Вы чаще всего будете управлять каким-либо образом веб-документами.  Обычно это делается с помощью Document Object Model (DOM), набора API-интерфейсов для управления HTML-разметкой и стилями, которые используют объект {{domxref ("Document")}}. В этой статье мы рассмотрим, как использовать DOM, а также некоторые интересные API, которые могут изменить рабочую среду интересными способами.
              +
              При написании веб-страниц и приложений вы чаще всего будете управлять каким-либо образом веб-документами.  Обычно это делается с помощью Document Object Model (DOM), набора API-интерфейсов для управления HTML-разметкой и стилями, которые используют объект {{domxref ("Document")}}. В этой статье мы рассмотрим, как использовать DOM, а также некоторые интересные API, которые могут изменить рабочую среду интересными способами.
              Получение данных с сервера
              Другой очень распространённой задачей в современных веб-сайтах и приложениях является получение отдельных элементов данных с сервера для обновления разделов веб-страницы без необходимости загрузки абсолютно новой страницы. Эта, казалось бы, небольшая деталь оказала огромное влияние на производительность и поведение сайтов, поэтому в этой статье мы объясним концепцию и рассмотрим технологии, которые позволяют это, например {{domxref("XMLHttpRequest")}} и Fetch API.
              Сторонние API
              diff --git a/files/ru/learn/javascript/client-side_web_apis/introduction/index.html b/files/ru/learn/javascript/client-side_web_apis/introduction/index.html index e3e8737948..0645247fd8 100644 --- a/files/ru/learn/javascript/client-side_web_apis/introduction/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/introduction/index.html @@ -91,7 +91,7 @@ translation_of: Learn/JavaScript/Client-side_web_APIs/Introduction
            -

            Note: Вы можете найти информацию о гораздо большем количестве сторонних API в Каталоге Web API.

            +

            Note: вы можете найти информацию о гораздо большем количестве сторонних API в Каталоге Web API.

            Как работает API?

            @@ -213,7 +213,7 @@ var ctx = canvas.getContext('2d'); };
            -

            Note: Вы можете увидеть этот код в действии в нашем bouncing balls demo (see it running live also).

            +

            Note: вы можете увидеть этот код в действии в нашем bouncing balls demo (see it running live also).

            Они используют события для управления состоянием

            @@ -237,7 +237,7 @@ request.onload = function() { }
            -

            Note: Вы можете увидеть этот код в действии в примере ajax.html (see it live also).

            +

            Note: вы можете увидеть этот код в действии в примере ajax.html (see it live also).

            В первых пяти строках мы задаём расположение ресурса, который хотим получить, создаём экземпляр объекта запроса с помощью конструктора XMLHttpRequest(), открываем HTTP-запрос GET, чтобы получить запрашиваемый ресурс, определяем, что мы хотим получить этот ресурс в формате json, после чего отсылаем запрос.

            diff --git a/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html b/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html index 69af264c07..a0c76883ab 100644 --- a/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html +++ b/files/ru/learn/javascript/client-side_web_apis/third_party_apis/index.html @@ -89,7 +89,7 @@ var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
            1. -

              Чтобы начать этот раздел, сделайте себе копию исходного файла Карт Google, в новой папке. Если Вы уже клонировали репозиторий примеров, у вас уже есть копия этого файла, которую Вы можете найти в папке the javascript/apis/third-party-apis/google-maps.

              +

              Чтобы начать этот раздел, сделайте себе копию исходного файла Карт Google, в новой папке. Если вы уже клонировали репозиторий примеров, у вас уже есть копия этого файла, которую вы можете найти в папке the javascript/apis/third-party-apis/google-maps.

            2. Затем получите свой собственный ключ разработчика, выполнив следующие шаги:

              diff --git a/files/ru/learn/javascript/first_steps/arrays/index.html b/files/ru/learn/javascript/first_steps/arrays/index.html index 81745d52f6..e2da17c448 100644 --- a/files/ru/learn/javascript/first_steps/arrays/index.html +++ b/files/ru/learn/javascript/first_steps/arrays/index.html @@ -218,7 +218,7 @@ for (var i = 0; i < sequence.length; i++) {

              Преобразование между строками и массивами

              -

              Часто у Вас могут быть некоторые необработанные данные, содержащиеся в большой длинной строке, и вы можете захотеть разделить полезные пункты до более удобной и полезной формы, а затем сделать что-то для них, например отобразить их в таблице данных. Для этого мы можем использовать метод {{jsxref ("String.prototype.split ()", "split ()")}}. В его простейшей форме он принимает единственный параметр, символ, который вы хотите отделить в строке, и возвращает подстроки между разделителем как элементы в массиве.

              +

              Часто у вас могут быть некоторые необработанные данные, содержащиеся в большой длинной строке, и вы можете захотеть разделить полезные пункты до более удобной и полезной формы, а затем сделать что-то для них, например отобразить их в таблице данных. Для этого мы можем использовать метод {{jsxref ("String.prototype.split ()", "split ()")}}. В его простейшей форме он принимает единственный параметр, символ, который вы хотите отделить в строке, и возвращает подстроки между разделителем как элементы в массиве.

              Заметка: Хорошо, технически это строковый метод, не метод массива, но мы поместили его в массивы, так как он хорошо подходит для них.

              @@ -653,7 +653,7 @@ textarea.onkeyup = function(){

              Прочитав эту статью, мы уверены, что вы согласитесь, что массивы кажутся довольно полезными; вы увидите, что они появляются повсюду в JavaScript, часто в сочетании с циклами, чтобы делать то же самое для каждого элемента массива. Мы научим вас всем полезным основам, которые нужно знать о циклах в следующем модуле, но пока вы должны себе похлопать и воспользоваться заслуженным перерывом; вы проработали все статьи в этом модуле!

              -

              Осталось только выполнить тестовую задачу, которая проверит ваше понимание статей, которые Вы прочли до этого момента. Удачи!

              +

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

              Посмотрите также

              diff --git a/files/ru/learn/javascript/first_steps/index.html b/files/ru/learn/javascript/first_steps/index.html index c1f7991f3d..9e296362a7 100644 --- a/files/ru/learn/javascript/first_steps/index.html +++ b/files/ru/learn/javascript/first_steps/index.html @@ -23,7 +23,7 @@ original_slug: Learn/JavaScript/Первые_шаги
          -

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

          +

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

          Руководства

          diff --git a/files/ru/learn/javascript/first_steps/variables/index.html b/files/ru/learn/javascript/first_steps/variables/index.html index cd0dad82d1..7c7b5e42ec 100644 --- a/files/ru/learn/javascript/first_steps/variables/index.html +++ b/files/ru/learn/javascript/first_steps/variables/index.html @@ -38,8 +38,8 @@ original_slug: Learn/JavaScript/Первые_шаги/Variables
          const button = document.querySelector('button');
           
           button.onclick = function() {
          -  let name = prompt('Как Вас зовут?');
          -  alert('Привет ' + name + ', рады видеть Вас!');
          +  let name = prompt('Как вас зовут?');
          +  alert('Привет ' + name + ', рады видеть вас!');
           }

          {{ EmbedLiveSample('What_is_a_variable', '100%', 50, "", "", "hide-codepen-jsfiddle") }}

          diff --git a/files/ru/learn/javascript/first_steps/what_is_javascript/index.html b/files/ru/learn/javascript/first_steps/what_is_javascript/index.html index 62370e6f3e..950006b041 100644 --- a/files/ru/learn/javascript/first_steps/what_is_javascript/index.html +++ b/files/ru/learn/javascript/first_steps/what_is_javascript/index.html @@ -25,14 +25,14 @@ original_slug: Learn/JavaScript/Первые_шаги/What_is_JavaScript

          Определение высокого уровня

          -

          JavaScript это язык, который позволяет Вам применять сложные вещи на web странице — каждый раз, когда на web странице происходит что-то большее, чем просто её статичное отображение — отображение периодически обновляемого контента, или интерактивных карт, или анимация 2D/3D графики, или прокрутка видео в проигрывателе, и т.д. — можете быть уверены, что скорее всего, не обошлось без JavaScript. Это третий слой слоёного пирога стандартных web технологий, два из которых (HTML и CSS) мы детально раскрыли в других частях учебного пособия.

          +

          JavaScript это язык, который позволяет вам применять сложные вещи на web странице — каждый раз, когда на web странице происходит что-то большее, чем просто её статичное отображение — отображение периодически обновляемого контента, или интерактивных карт, или анимация 2D/3D графики, или прокрутка видео в проигрывателе, и т.д. — можете быть уверены, что скорее всего, не обошлось без JavaScript. Это третий слой слоёного пирога стандартных web технологий, два из которых (HTML и CSS) мы детально раскрыли в других частях учебного пособия.

          • {{glossary("HTML")}} - это язык разметки, который мы используем для визуального и смыслового структурирования нашего web контента, например, определяем параграфы, заголовки, таблицы данных, или вставляем изображения и видео на страницу.
          • {{glossary("CSS")}} - это язык стилей с помощью которого мы придаём стиль отображения нашего HTML контента, например придаём цвет фону (background) и шрифту, придаём контенту многоколоночный вид.
          • -
          • {{glossary("JavaScript")}} язык программирования, который позволяет Вам создать динамически обновляемый контент, управляет мультимедиа, анимирует изображения, впрочем, делает всё, что угодно. Окей, не все, что угодно, но всё равно, это удивительно, что можно достичь с помощью нескольких строк JavaScript кода.
          • +
          • {{glossary("JavaScript")}} язык программирования, который позволяет вам создать динамически обновляемый контент, управляет мультимедиа, анимирует изображения, впрочем, делает всё, что угодно. Окей, не все, что угодно, но всё равно, это удивительно, что можно достичь с помощью нескольких строк JavaScript кода.

          Три слоя прекрасно выстраиваются друг над другом. Возьмём простой текст для примера. Для придания структуры и смыслового назначения тексту, разметим его с помощью HTML:

          @@ -220,7 +220,7 @@ function updateName() {
          -

          Заметка: Вы можете увидеть эту версию на GitHub-е как apply-javascript-internal.html (посмотреть вживую).

          +

          Заметка: вы можете увидеть эту версию на GitHub-е как apply-javascript-internal.html (посмотреть вживую).

          Внешний JavaScript

          @@ -249,7 +249,7 @@ for(let i = 0; i < buttons.length ; i++) {
          -

          Заметка: Вы можете увидеть эту версию на GitHub-е как apply-javascript-external.html и script.js (посмотреть вживую).

          +

          Заметка: вы можете увидеть эту версию на GitHub-е как apply-javascript-external.html и script.js (посмотреть вживую).

          Инлайновые JavaScript обработчики

          diff --git a/files/ru/learn/javascript/index.html b/files/ru/learn/javascript/index.html index 4e58a5299e..cd70584473 100644 --- a/files/ru/learn/javascript/index.html +++ b/files/ru/learn/javascript/index.html @@ -39,9 +39,9 @@ translation_of: Learn/JavaScript
          Первые шаги в JavaScript
          В нашем первом модуле, посвящённом JavaScript, мы сначала ответим на несколько главных вопросов, таких, как "Что такое JavaScript?",  "На что он похож?" и "Что с его помощью можно сделать?", а затем перейдём к практике - расскажем, как писать и выполнять код на JavaScript. После чего подробнее рассмотрим некоторые ключевые конструкции JavaScript: переменные, строки, числа и массивы.
          Структурные элементы JavaScript
          -
          В этом модуле мы продолжим изучение главных составных частей JavaScript и обратим внимание на повсеместно встречающиеся типы конструкций: условные операторы, циклы, функции и события. В ходе обучения Вы уже сталкивались с ними, но только мимоходом. Теперь мы поговорим именно о них.
          +
          В этом модуле мы продолжим изучение главных составных частей JavaScript и обратим внимание на повсеместно встречающиеся типы конструкций: условные операторы, циклы, функции и события. В ходе обучения вы уже сталкивались с ними, но только мимоходом. Теперь мы поговорим именно о них.
          Введение в объекты JavaScript
          -
          Практически всё, что встречается в JavaScript, является объектом. Начиная с таких ключевых конструкций, как строки и массивы, и заканчивая интерфейсом взаимодействия с браузером, который построен поверх JavaScript. Вы даже можете создавать собственные объекты, заключая взаимосвязанные функции и переменные в готовые пакеты. Если Вы хотите продолжить изучение языка и писать более эффективный код, то очень важно понять объектно-ориентированную природу JavaScript. Чтобы помочь Вам в этом, мы представляем этот модуль. В нем мы подробно рассматриваем основы и синтаксис ООП (объектно-ориентированного программирования), показываем, как создавать свои объекты, и объясняем, что такое данные в формате JSON и как с ними работать.
          +
          Практически всё, что встречается в JavaScript, является объектом. Начиная с таких ключевых конструкций, как строки и массивы, и заканчивая интерфейсом взаимодействия с браузером, который построен поверх JavaScript. Вы даже можете создавать собственные объекты, заключая взаимосвязанные функции и переменные в готовые пакеты. Если вы хотите продолжить изучение языка и писать более эффективный код, то очень важно понять объектно-ориентированную природу JavaScript. Чтобы помочь вам в этом, мы представляем этот модуль. В нем мы подробно рассматриваем основы и синтаксис ООП (объектно-ориентированного программирования), показываем, как создавать свои объекты, и объясняем, что такое данные в формате JSON и как с ними работать.
          Клиентский Web API
          При написании клиентского JavaScript для сайтов или приложений вы не обойдётесь без использования API - то есть интерфейсов для работы с различными функциями браузера или операционной системы, на которой работает сайт, или даже для работы с данными, получаемыми с других сайтов или сервисов. В этом модуле мы изучим, какие это API и как использовать некоторые наиболее распространённые API, которые вам будут часто попадаться во время разработки.
          diff --git a/files/ru/learn/javascript/objects/basics/index.html b/files/ru/learn/javascript/objects/basics/index.html index 96b2a082cd..0c8b3f6a5e 100644 --- a/files/ru/learn/javascript/objects/basics/index.html +++ b/files/ru/learn/javascript/objects/basics/index.html @@ -36,11 +36,11 @@ original_slug: Learn/JavaScript/Объекты/Основы
          const person = {};
          -

          Если Вы введёте person в текстовое JS консоль и нажмёте клавишу Enter, должен получиться следующий результат:

          +

          Если вы введёте person в текстовое JS консоль и нажмёте клавишу Enter, должен получиться следующий результат:

          Object { }
          -

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

          +

          Поздравляем, вы только что создали ваш первый объект. Но это пустой объект, поэтому мы не можем с ним ничего сделать. Давайте обновим наш объект, чтобы он выглядел так:

          const person = {
             name: ['Bob', 'Smith'],
          @@ -68,7 +68,7 @@ person.greeting()

          Как видите, наш объект содержит некоторые данные, а также несколько методов. У нас же с помощью простого синтаксиса есть доступ к ним.

          -

          Примечание: Если у вас возникли проблемы с применением файла в работе, попробуйте сравнить ваш код с нашей версией — см. oojs-finished.html (также see it running live). Одна из распространённых ошибок, когда Вы начинаете с объектами ставить запятую в конце последнего члена — это приводит к ошибке.

          +

          Примечание: Если у вас возникли проблемы с применением файла в работе, попробуйте сравнить ваш код с нашей версией — см. oojs-finished.html (также see it running live). Одна из распространённых ошибок, когда вы начинаете с объектами ставить запятую в конце последнего члена — это приводит к ошибке.

          Итак что здесь происходит? Объект состоит из нескольких элементов, каждый из которых имеет своё название (пример name и age выше), и значение (пример ['Bob', 'Smith'] и 32). Каждая пара название/значение должны быть разделены запятой, а название и значение в каждом случае разделяются двоеточием. Синтаксис всегда следует этому образцу:

          @@ -87,7 +87,7 @@ person.greeting()

          Точечная запись (Dot notation)

          -

          Выше Вы получили доступ к свойствам и методам используя точечную запись (dot notation). Имя объекта (person) действует как пространство имён (namespace) — оно должно быть введено первым, для того чтобы получить доступ ко всему что заключено (encapsulated) внутри объекта. Далее Вы пишете точку, затем элемент, к которому хотите получить доступ — это может быть имя простого свойства, элемент массива, или вызов одного из методов объекта, например:

          +

          Выше вы получили доступ к свойствам и методам используя точечную запись (dot notation). Имя объекта (person) действует как пространство имён (namespace) — оно должно быть введено первым, для того чтобы получить доступ ко всему что заключено (encapsulated) внутри объекта. Далее вы пишете точку, затем элемент, к которому хотите получить доступ — это может быть имя простого свойства, элемент массива, или вызов одного из методов объекта, например:

          person.age
           person.interests[1]
          @@ -106,7 +106,7 @@ person.bio()
          last: 'Smith' }, -

          Здесь мы фактически создаём внутреннее пространство имён (sub-namespace). Это звучит сложно, но на самом деле это не так — для доступа к этим элементам Вам нужно сделать один дополнительный шаг с ещё одной точкой. Попробуйте в консоли браузера следующее: 

          +

          Здесь мы фактически создаём внутреннее пространство имён (sub-namespace). Это звучит сложно, но на самом деле это не так — для доступа к этим элементам вам нужно сделать один дополнительный шаг с ещё одной точкой. Попробуйте в консоли браузера следующее: 

          person.name.first
           person.name.last
          @@ -135,11 +135,11 @@ person.name.first
          person['age']
           person['name']['first']
          -

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

          +

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

          Запись элементов в объект

          -

          До сих пор мы рассматривали только возврат (или получение) элементов объекта — Вы так же можете установить (обновить) значение элемента объекта просто объявив элемент, который Вы хотите установить (используя точечную или скобочную запись), например:

          +

          До сих пор мы рассматривали только возврат (или получение) элементов объекта — вы так же можете установить (обновить) значение элемента объекта просто объявив элемент, который вы хотите установить (используя точечную или скобочную запись), например:

          person.age = 45;
           person['name']['last'] = 'Cratchit';
          @@ -154,7 +154,7 @@ person['name']['last']
          person['eyes'] = 'hazel';
           person.farewell = function() { alert("Bye everybody!"); }
          -

          Теперь Вы можете проверить ваши новые элементы:

          +

          Теперь вы можете проверить ваши новые элементы:

          person['eyes']
           person.farewell()
          @@ -188,7 +188,7 @@ person[myDataName] = myDataValue; alert('Hi! I\'m ' + this.name.first + '.'); } -

          Вы, вероятно, задаётесь вопросом, что такое "this"? Ключевое слово this, ссылается на текущий объект, внутри которого пишется код — поэтому в нашем случае this равен объекту person. Но почему просто не написать person? Как Вы увидите в статье Object-oriented JavaScript for beginners (Объектно-ориентированный JavaScript для начинающих), когда мы начинаем создавать конструкторы и т.д., this очень полезен — он всегда будет гарантировать, что используется верное значение, когда контекст элемента изменяется (например, два разных экземпляра объекта person могут иметь разные имена, но захотят использовать своё собственное имя при приветствии.

          +

          Вы, вероятно, задаётесь вопросом, что такое "this"? Ключевое слово this, ссылается на текущий объект, внутри которого пишется код — поэтому в нашем случае this равен объекту person. Но почему просто не написать person? Как вы увидите в статье Object-oriented JavaScript for beginners (Объектно-ориентированный JavaScript для начинающих), когда мы начинаем создавать конструкторы и т.д., this очень полезен — он всегда будет гарантировать, что используется верное значение, когда контекст элемента изменяется (например, два разных экземпляра объекта person могут иметь разные имена, но захотят использовать своё собственное имя при приветствии.

          Давайте проиллюстрируем, что мы имеем в виду, с упрощённой парой объектов person :

          @@ -206,19 +206,19 @@ const person2 = { } } -

          В этом случае, person1.greeting() выведет "Hi! I'm Chris.". person2.greeting(), с другой стороны, выведет "Hi! I'm Brian.", хотя код метода одинаковый в обоих случаях. Как мы сказали ранее, this равен объекту, внутри которого находится код — это не очень полезно, когда Вы пишите литералы объектов вручную, но оно действительно помогает, когда Вы генерируете объекты динамически (например используя конструкторы). Это станет понятнее чуть позже.

          +

          В этом случае, person1.greeting() выведет "Hi! I'm Chris.". person2.greeting(), с другой стороны, выведет "Hi! I'm Brian.", хотя код метода одинаковый в обоих случаях. Как мы сказали ранее, this равен объекту, внутри которого находится код — это не очень полезно, когда вы пишите литералы объектов вручную, но оно действительно помогает, когда вы генерируете объекты динамически (например используя конструкторы). Это станет понятнее чуть позже.

          Все это время вы использовали объекты

          -

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

          +

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

          -

          Поэтому, когда Вы использовали строковые методы, такие как:

          +

          Поэтому, когда вы использовали строковые методы, такие как:

          myString.split(',');

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

          -

          Когда Вы обращались к объектной модели документа (DOM), используя следующие строки:

          +

          Когда вы обращались к объектной модели документа (DOM), используя следующие строки:

          const myDiv = document.createElement('div');
           const myVideo = document.querySelector('video');
          @@ -227,7 +227,7 @@ const myVideo = document.querySelector('video');

          То же самое относится и к любому другому встроенному объекту/API, который вы использовали — Array, Math, и т. д.

          -

          Обратите внимание, что встроенные объекты/API не всегда создают экземпляры объектов автоматически. Как пример, Notifications API — который позволяет новым браузерам запускать системные уведомления, требует, чтобы Вы создавали новый экземпляр объекта с помощью конструктора для каждого уведомления, которое Вы хотите запустить. Попробуйте ввести следующее в консоль JavaScript:

          +

          Обратите внимание, что встроенные объекты/API не всегда создают экземпляры объектов автоматически. Как пример, Notifications API — который позволяет новым браузерам запускать системные уведомления, требует, чтобы вы создавали новый экземпляр объекта с помощью конструктора для каждого уведомления, которое вы хотите запустить. Попробуйте ввести следующее в консоль JavaScript:

          const myNotification = new Notification('Hello!');
          @@ -239,7 +239,7 @@ const myVideo = document.querySelector('video');

          Резюме

          -

          Поздравляем, Вы достигли конца нашей первой статьи о объектах JS, теперь у вас должно быть хорошее представление о том, как работать с объектами в JavaScript - в том числе создавать свои собственные простые объекты. Вы также должны понимать, что объекты очень полезны в качестве структур для хранения связанных данных и функциональности - если бы мы пытались отслеживать все свойства и методы в нашем объекте person как отдельные переменные и функции, это было неэффективно, и мы бы рисковали столкнуться с другими переменными и функциями с такими же именами. Объекты позволяют нам безопасно хранить информацию в своём собственном блоке, вне опасности.

          +

          Поздравляем, вы достигли конца нашей первой статьи о объектах JS, теперь у вас должно быть хорошее представление о том, как работать с объектами в JavaScript - в том числе создавать свои собственные простые объекты. Вы также должны понимать, что объекты очень полезны в качестве структур для хранения связанных данных и функциональности - если бы мы пытались отслеживать все свойства и методы в нашем объекте person как отдельные переменные и функции, это было неэффективно, и мы бы рисковали столкнуться с другими переменными и функциями с такими же именами. Объекты позволяют нам безопасно хранить информацию в своём собственном блоке, вне опасности.

          В следующей статье мы начнём рассматривать теорию объектно-ориентированного программирования (ООП) и как эти техники могут быть использованы в JavaScript 

          diff --git a/files/ru/learn/javascript/objects/index.html b/files/ru/learn/javascript/objects/index.html index a5dc196517..f45647931c 100644 --- a/files/ru/learn/javascript/objects/index.html +++ b/files/ru/learn/javascript/objects/index.html @@ -15,12 +15,12 @@ original_slug: Learn/JavaScript/Объекты

          Необходимые знания

          -

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

          +

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

          -

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

          +

          Также вам необходимо знать основы JavaScript перед подробным изучением объектов JavaScript. Предварительно поработайте с разделами Первые шаги в JavaScript и Структурные элементы в JavaScript перед началом изучения данного модуля.

          -

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

          +

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

          Руководства

          @@ -33,11 +33,11 @@ original_slug: Learn/JavaScript/Объекты
          Прототипы объектов
          Прототипы - это механизм, благодаря которому объекты в JavaScript наследуют функциональность друг друга, но при этом они работают иначе по сравнению с механизмами наследования в классических объектно-ориентированных языках. В этой статье мы изучим эти отличия, объясним, как работает цепочка прототипов, и рассмотрим, как свойство прототипа может быть использовано для добавления методов к существующим конструкторам.
          Наследование в JavaScript
          -
          После знакомства с самыми жуткими подробностями OOJS, эта статья покажет, как создавать "дочерние" классы объектов (конструкторы), которые наследуют функциональность от своих "родительских" классов. В дополнении, мы дадим Вам пару советов о том, где и когда можно использовать OOJS.
          +
          После знакомства с самыми жуткими подробностями OOJS, эта статья покажет, как создавать "дочерние" классы объектов (конструкторы), которые наследуют функциональность от своих "родительских" классов. В дополнении, мы дадим вам пару советов о том, где и когда можно использовать OOJS.
          Работа с JSON-данными
          Представление объектов в JavaScript (JavaScript Object Notation) (JSON) - это стандартный формат для представления структурированных данных в виде объектов JavaScript, который обычно используется для представления и передачи данных на веб-сайтах (т.е. передача некоторых данных от сервера к клиенту - таким образом они могут быть отображены на веб-странице). Вы довольно часто будете с этим сталкиваться, поэтому в данной статье мы предоставим вам все, что необходимо для работы с JSON с помощью JavaScript, в том числе доступ к элементам данных в объекте JSON и написания собственного JSON-кода.
          Практика построения объектов
          -
          В предыдущих статьях мы рассматривали самые основные моменты в теории и синтаксисе объектов в JavaScript, дав Вам твёрдую основу для начала. В этой статье мы погрузимся в практические занятия, получим больше практической работы в построении собственных объектов в JavaScript, чтобы сделать кое-что весёлое и красочное - несколько цветных прыгающих шариков.
          +
          В предыдущих статьях мы рассматривали самые основные моменты в теории и синтаксисе объектов в JavaScript, дав вам твёрдую основу для начала. В этой статье мы погрузимся в практические занятия, получим больше практической работы в построении собственных объектов в JavaScript, чтобы сделать кое-что весёлое и красочное - несколько цветных прыгающих шариков.

          Задания

          diff --git a/files/ru/learn/javascript/objects/object-oriented_js/index.html b/files/ru/learn/javascript/objects/object-oriented_js/index.html index 4bbd0f0134..7fe8592651 100644 --- a/files/ru/learn/javascript/objects/object-oriented_js/index.html +++ b/files/ru/learn/javascript/objects/object-oriented_js/index.html @@ -200,23 +200,23 @@ person1.interests[1] person1.bio() // etc. -
          Примечание: Если у Вас возникли проблемы с работой кода, попробуйте сравнить его с нашей версией - см. oojs-class-finished.html (также смотрите, как он работает в прямом эфире).
          +
          Примечание: Если у вас возникли проблемы с работой кода, попробуйте сравнить его с нашей версией - см. oojs-class-finished.html (также смотрите, как он работает в прямом эфире).

          Дальнейшие упражнения

          Для начала, попробуйте добавить ещё пару собственных строк создания объекта и попробуйте получить и установить элементы полученных экземпляров объектов.

          -

          Кроме того, есть несколько проблем с нашим методом bio() - вывод всегда включает местоимение «He» ("Он" в пер. с англ.), даже если ваш человек является женщиной или какой-либо другой предпочтительной гендерной классификацией. И bio будет включать только два интереса, даже если в массиве interests указано больше. Можете ли Вы решить, как исправить это в определении класса (конструкторе)? Вы можете поместить любой код, который вам нравится внутри конструктора (вам, вероятно, понадобятся несколько условий и цикл). Подумайте о том, как предложения должны быть структурированы по-разному в зависимости от пола и в зависимости от того, имеет ли число перечисленных интересов 1, 2 или более 2.

          +

          Кроме того, есть несколько проблем с нашим методом bio() - вывод всегда включает местоимение «He» ("Он" в пер. с англ.), даже если ваш человек является женщиной или какой-либо другой предпочтительной гендерной классификацией. И bio будет включать только два интереса, даже если в массиве interests указано больше. Можете ли вы решить, как исправить это в определении класса (конструкторе)? Вы можете поместить любой код, который вам нравится внутри конструктора (вам, вероятно, понадобятся несколько условий и цикл). Подумайте о том, как предложения должны быть структурированы по-разному в зависимости от пола и в зависимости от того, имеет ли число перечисленных интересов 1, 2 или более 2.

          -

          Примечание: Если у Вас возникли трудности с решением задачи, мы предоставили ответ в нашем репозитории GitHub (см. это в действии) — но сначала попробуйте написать сами!

          +

          Примечание: Если у вас возникли трудности с решением задачи, мы предоставили ответ в нашем репозитории GitHub (см. это в действии) — но сначала попробуйте написать сами!

          Другие способы создания экземпляров объектов

          До сих пор мы видели два разных способа создания экземпляра объекта - объявление объектного литерала и использование функции конструктора (см. выше).

          -

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

          +

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

          Конструктор Object ()

          diff --git a/files/ru/learn/server-side/django/admin_site/index.html b/files/ru/learn/server-side/django/admin_site/index.html index c5842f12c3..40f9527485 100644 --- a/files/ru/learn/server-side/django/admin_site/index.html +++ b/files/ru/learn/server-side/django/admin_site/index.html @@ -106,7 +106,7 @@ admin.site.register(BookInstance)

          Создайте несколько экземпляров для каждой из ваших книг. Установите статус Available (доступен) для некоторых экземпляров и On loan (выдан) для остальных. Если статус экземпляра not Available (недоступен), то также установите дату возврата (Due back).

          -

          Вот и все!  Вы изучили как запустить и использовать админ-панель. Также были созданы записи для Book, BookInstance, Genre и Author, которые можно будет использовать после создания наших собственных представлений и шаблонов.

          +

          Вот и все! Вы изучили как запустить и использовать админ-панель. Также были созданы записи для Book, BookInstance, Genre и Author, которые можно будет использовать после создания наших собственных представлений и шаблонов.

          "Продвинутая" конфигурация

          diff --git a/files/ru/learn/server-side/django/authentication/index.html b/files/ru/learn/server-side/django/authentication/index.html index 4ecc14829b..8cfcb82ab5 100644 --- a/files/ru/learn/server-side/django/authentication/index.html +++ b/files/ru/learn/server-side/django/authentication/index.html @@ -80,7 +80,7 @@ MIDDLEWARE = [

          Вы уже создали своего первого пользователя когда мы рассматривали Административная панель сайта Django в части 4 (это был суперпользователь, созданный при помощи команды python manage.py createsuperuser). Наш суперпользователь уже авторизован и имеет все необходимые уровни доступа к данным и функциям, таким образом нам необходимо создать тестового пользователя для отработки соответствующей работы сайта. В качестве наиболее быстрого способа, мы будем использовать административную панель сайта для создания соответствующих групп и аккаунтов locallibrary.

          -

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

          +

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

          from django.contrib.auth.models import User
           
          @@ -133,7 +133,7 @@ user.save()
           

          В этом разделе мы покажем, как интегрировать систему по умолчанию в Сайт LocalLibrary и создать шаблоны.  Мы поместим их в основные URL проекта.

          -

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

          +

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

          @@ -150,7 +150,7 @@ urlpatterns += [ ]
          -

          Перейдите по http://127.0.0.1:8000/accounts/ URL (обратите внимание на косую черту!), Django покажет ошибку, что он не смог найти этот URL, и перечислить все URL, которые он пытался открыть. Из этого Вы можете увидеть URL-адреса, которые будут работать, например:

          +

          Перейдите по http://127.0.0.1:8000/accounts/ URL (обратите внимание на косую черту!), Django покажет ошибку, что он не смог найти этот URL, и перечислить все URL, которые он пытался открыть. Из этого вы можете увидеть URL-адреса, которые будут работать, например:

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

          @@ -181,7 +181,7 @@ Exception Value: registration/login.html Для этого сайта мы разместим наши HTML-страницы в каталоге templates / registration /. Этот каталог должен находиться в корневом каталоге проекта, то есть в том же каталоге, что и в каталоге и папках locallibrary). Создайте эти папки сейчас.

          -

          Примечание: Ваша структура папок теперь должна выглядеть как показано внизу:
          +

          Примечание: ваша структура папок теперь должна выглядеть как показано внизу:
          locallibrary (django project folder)
             |_catalog
             |_locallibrary
          diff --git a/files/ru/learn/server-side/django/deployment/index.html b/files/ru/learn/server-side/django/deployment/index.html index d5856754f6..318faf8a36 100644 --- a/files/ru/learn/server-side/django/deployment/index.html +++ b/files/ru/learn/server-side/django/deployment/index.html @@ -516,7 +516,7 @@ git push origin master

          heroku create
          -

          Заметка: Вы можете назвать удалённый, если хотите, указав значение после «create». Если вы этого не сделаете, вы получите случайное имя. Имя используется в URL-адресе по умолчанию.

          +

          Заметка: вы можете назвать удалённый, если хотите, указав значение после «create». Если вы этого не сделаете, вы получите случайное имя. Имя используется в URL-адресе по умолчанию.

          Затем мы можем подтолкнуть наше приложение в репозиторий heroku как показано ниже. Это позволит загрузить приложение, упаковать его в dyno, запустить collectstatic, и запустить сам сайт.

          diff --git a/files/ru/learn/server-side/django/sessions/index.html b/files/ru/learn/server-side/django/sessions/index.html index 8197cebbdc..8169728580 100644 --- a/files/ru/learn/server-side/django/sessions/index.html +++ b/files/ru/learn/server-side/django/sessions/index.html @@ -115,7 +115,7 @@ request.session['my_car']['wheels'] = 'alloy'
          -

          Примечание: Вы можете изменить поведение сессий таким образом, чтобы они записывали любое своё изменение в базу данных и отправляли куки, при каждом запросе, путём установки SESSION_SAVE_EVERY_REQUEST = True, в файле настроек проекта (locallibrary/locallibrary/settings.py).

          +

          Примечание: вы можете изменить поведение сессий таким образом, чтобы они записывали любое своё изменение в базу данных и отправляли куки, при каждом запросе, путём установки SESSION_SAVE_EVERY_REQUEST = True, в файле настроек проекта (locallibrary/locallibrary/settings.py).

          Простой пример — получение числа визитов

          diff --git a/files/ru/learn/server-side/django/skeleton_website/index.html b/files/ru/learn/server-side/django/skeleton_website/index.html index 5056a473fd..821bbf9063 100644 --- a/files/ru/learn/server-side/django/skeleton_website/index.html +++ b/files/ru/learn/server-side/django/skeleton_website/index.html @@ -329,7 +329,7 @@ python3 manage.py migrate

          На данном этапе, мы поняли, что Django работает должным образом! 

          -

          Заметка: Вам следует перезапускать миграцию и заново тестировать сайт, после того как вы делаете важные изменения. Поверьте, это не займёт много времени!

          +

          Заметка: вам следует перезапускать миграцию и заново тестировать сайт, после того как вы делаете важные изменения. Поверьте, это не займёт много времени!

          Домашнее задание

          diff --git a/files/ru/learn/server-side/express_nodejs/displaying_data/locallibrary_base_template/index.html b/files/ru/learn/server-side/express_nodejs/displaying_data/locallibrary_base_template/index.html index 44674cca2c..c8b39b2872 100644 --- a/files/ru/learn/server-side/express_nodejs/displaying_data/locallibrary_base_template/index.html +++ b/files/ru/learn/server-side/express_nodejs/displaying_data/locallibrary_base_template/index.html @@ -49,7 +49,7 @@ html(lang='en')

          Шаблон использует (и включает) JavaScript и CSS из  Bootstrap , что позволяет улучшить макет и представление HTML-страницы. Применение Bootstrap или другого клиентского фреймворка - быстрый способ создать привлекательную, хорошо масштабируемую страницу. Кроме того, это позволяет получить представление страницы, не вдаваясь в детали - мы можем уделить все внимание коду на стороне сервера!

          -

          Макет представляется достаточно очевидным, если Вы уже прочли статью Основы шаблонов (Template primer) выше. Обратите внимание на использование block content в качестве места для  размещения контента отдельных страниц.

          +

          Макет представляется достаточно очевидным, если вы уже прочли статью Основы шаблонов (Template primer) выше. Обратите внимание на использование block content в качестве места для  размещения контента отдельных страниц.

          Базовый шаблон также ссылается на локальный файл стилей (style.css), что обеспечивает дополнительное управление внешним видом. Откройте /public/stylesheets/style.css и замените его содержимое таким текстом:

          diff --git a/files/ru/learn/server-side/express_nodejs/forms/index.html b/files/ru/learn/server-side/express_nodejs/forms/index.html index 8048ad020b..55eab9d0c1 100644 --- a/files/ru/learn/server-side/express_nodejs/forms/index.html +++ b/files/ru/learn/server-side/express_nodejs/forms/index.html @@ -11,7 +11,7 @@ translation_of: Learn/Server-side/Express_Nodejs/forms
          {{PreviousMenuNext("Learn/Server-side/Express_Nodejs/Displaying_data", "Learn/Server-side/Express_Nodejs/deployment", "Learn/Server-side/Express_Nodejs")}}
          -

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

          +

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

          @@ -180,7 +180,7 @@ sanitizeBody('date').toDate(),
          • Создайте объект, используя объекты, которые уже существуют (таким образом, пользователи должны будут создать все необходимые экземпляры автора и жанра, прежде чем пытаться создать любые объекты книги).
          • -
          • Удалите объект, если на него не ссылаются другие объекты (например, Вы не сможете удалить книгу, пока не будут удалены все связанные объекты BookInstance).
          • +
          • Удалите объект, если на него не ссылаются другие объекты (например, вы не сможете удалить книгу, пока не будут удалены все связанные объекты BookInstance).
          diff --git a/files/ru/learn/server-side/express_nodejs/introduction/index.html b/files/ru/learn/server-side/express_nodejs/introduction/index.html index 36bf2f9eb9..881a3c70d6 100644 --- a/files/ru/learn/server-side/express_nodejs/introduction/index.html +++ b/files/ru/learn/server-side/express_nodejs/introduction/index.html @@ -15,7 +15,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Introduction
          - +
          Цель:Ознакомить Вас с фреймворком Express и как он вписывается в среду  Node, какие функции он предоставляет, и основные строительные блоки приложения Express.Ознакомить вас с фреймворком Express и как он вписывается в среду  Node, какие функции он предоставляет, и основные строительные блоки приложения Express.
          @@ -39,7 +39,7 @@ translation_of: Learn/Server-side/Express_Nodejs/Introduction

          Hello Node.js

          -

          Следующий пример создаёт веб сервер который обрабатывает любой HTTP запрос на URL http://127.0.0.1:8000/ — когда запрос будет получен, скрипт ответит строкой "Hello World". Если Вы уже установили node, можете, следуя шагам инструкции попробовать пример:

          +

          Следующий пример создаёт веб сервер который обрабатывает любой HTTP запрос на URL http://127.0.0.1:8000/ — когда запрос будет получен, скрипт ответит строкой "Hello World". Если вы уже установили node, можете, следуя шагам инструкции попробовать пример:

          1. Откройте терминал (в Windows окно командной строки)
          2. @@ -108,7 +108,7 @@ server.listen(port, hostname, () => {

            Node первоначально был выпущен только под Linux в 2009. Менеджер пакетов NPM был выпущен в 2010, а поддержка Windows была добавлена в 2012. Текущая LTS-версия Node v12.16.1 , в то время как последний выпуск Node версии 13.11.0. Это короткий экскурс в историю; обратитесь к Википедии, если вы хотите узнать больше).

            -

            Express первоначально был выпущен в ноябре 2010 и текущая версия API 4.17.1 Вы можете отследить изменения и текущий релиз, и GitHub для более детальной информации о релизах.

            +

            Express первоначально был выпущен в ноябре 2010 и текущая версия API 4.17.1 вы можете отследить изменения и текущий релиз, и GitHub для более детальной информации о релизах.

            Насколько популярен Node/Express?

            diff --git a/files/ru/learn/server-side/express_nodejs/mongoose/index.html b/files/ru/learn/server-side/express_nodejs/mongoose/index.html index 7bbcc23eb4..2bdb148679 100644 --- a/files/ru/learn/server-side/express_nodejs/mongoose/index.html +++ b/files/ru/learn/server-side/express_nodejs/mongoose/index.html @@ -50,7 +50,7 @@ translation_of: Learn/Server-side/Express_Nodejs/mongoose

            Преимущество применения ORM состоит в том, что программисты могут сосредоточиться на объектах JavaScript, а не  на семантике базы данных —  особенно, если требуется работать с разными базами данных (на одном или разных веб-сайтах). Они также дают очевидное место для валидации и проверки данных.

            -

            Совет:  Применение ODM / ORMs часто приводит к снижению затрат на разработку и обслуживание! Если Вы не очень хорошо знакомы с родным языком запросов или если производительность имеет первостепенное значение, следует серьёзно рассмотреть возможность применения ODM.

            +

            Совет:  Применение ODM / ORMs часто приводит к снижению затрат на разработку и обслуживание! Если вы не очень хорошо знакомы с родным языком запросов или если производительность имеет первостепенное значение, следует серьёзно рассмотреть возможность применения ODM.

            Какую модель ORM/ODM следует использовать?

            @@ -535,7 +535,7 @@ SomeModel.find(callback_function);
            • -

              Выберите ближайший к Вам регион и щёлкните кнопку Continue.

              +

              Выберите ближайший к вам регион и щёлкните кнопку Continue.

            diff --git a/files/ru/learn/server-side/first_steps/introduction/index.html b/files/ru/learn/server-side/first_steps/introduction/index.html index 666d13af69..a095ac9189 100644 --- a/files/ru/learn/server-side/first_steps/introduction/index.html +++ b/files/ru/learn/server-side/first_steps/introduction/index.html @@ -122,7 +122,7 @@ translation_of: Learn/Server-side/First_steps/Introduction

            Из-за того, что информация находится в базе данных, её также можно легко передать и обновить через другие бизнес системы (например, отслеживание).

            -

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

            +

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

            1. Зайдите на Amazon или в другой интернет-магазин.
            2. diff --git a/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html b/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html index e96fcf7bf7..0edd5701ab 100644 --- a/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html +++ b/files/ru/learn/tools_and_testing/cross_browser_testing/feature_detection/index.html @@ -232,7 +232,7 @@ blob-constructor cookies cors ...AND LOADS MORE VALUES!>
        -

        Примечание: Вы можете найти список того, что означают все имена классов — см.  Функции, обнаруженные Modernizr.

        +

        Примечание: вы можете найти список того, что означают все имена классов — см.  Функции, обнаруженные Modernizr.

        Далее, давайте обновим наш CSS, чтобы использовать Modernizr вместо @supports. Перейдите в modernizr-css.css, и замените два блока @supports следующим:

        diff --git a/files/ru/mdn/about/index.html b/files/ru/mdn/about/index.html index 6ff3fbd3a1..56c29dbe8c 100644 --- a/files/ru/mdn/about/index.html +++ b/files/ru/mdn/about/index.html @@ -30,7 +30,7 @@ translation_of: MDN/About

        Если вы не уверены должна ли какая-либо тема быть представлена на MDN, прочитайте: Нужно ли это на MDN?

        -

        Как Вы можете помочь?

        +

        Как вы можете помочь?

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

        diff --git a/files/ru/mdn/contribute/getting_started/index.html b/files/ru/mdn/contribute/getting_started/index.html index a7aa354333..653a62a472 100644 --- a/files/ru/mdn/contribute/getting_started/index.html +++ b/files/ru/mdn/contribute/getting_started/index.html @@ -15,7 +15,7 @@ translation_of: MDN/Contribute/Getting_started

        MDN построена по принципу вики, где каждый может добавлять и редактировать контент. Вам не обязательно быть программистом или много знать о технологиях. Здесь много задач, которые необходимо сделать: от простых (корректура и исправление опечаток) до сложных (написание документации для API).

        -

        Сделать вклад в развитие MDN легко и безопасно. Даже если Вы допустили ошибку, её легко можно исправить. Даже если Вы не знаете точно, как что-то должно выглядеть, или Ваша грамматика недостаточно хороша, не беспокойтесь об этом! У нас есть команда людей, работа которых состоит в том, чтобы на MDN был максимально хороший контент. Кто-нибудь обязательно проверит, насколько Ваши работы аккуратно и хорошо написаны. Делитесь тем, что вы знаете и верьте в свои силы.

        +

        Сделать вклад в развитие MDN легко и безопасно. Даже если вы допустили ошибку, её легко можно исправить. Даже если вы не знаете точно, как что-то должно выглядеть, или ваша грамматика недостаточно хороша, не беспокойтесь об этом! У нас есть команда людей, работа которых состоит в том, чтобы на MDN был максимально хороший контент. Кто-нибудь обязательно проверит, насколько ваши работы аккуратно и хорошо написаны. Делитесь тем, что вы знаете и верьте в свои силы.

        Шаг 1: Создайте аккаунт MDN

        @@ -25,23 +25,23 @@ translation_of: MDN/Contribute/Getting_started

        Шаг 2: Выберите задачу для выполнения

        -

        Теперь, когда у Вас есть аккаунт в MDN, прочтите описание различных типов задач в {{anch("Возможные типы задач", "списке ниже")}}, и решите, какая из них наиболее Вам подходит. Вы можете начать выполнять любую понравившуюся задачу.

        +

        Теперь, когда у вас есть аккаунт в MDN, прочтите описание различных типов задач в {{anch("Возможные типы задач", "списке ниже")}}, и решите, какая из них наиболее вам подходит. Вы можете начать выполнять любую понравившуюся задачу.

        Шаг 3: Выполните задачу

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

        -

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

        +

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

        -

        Внимание: Если Вы хотите поэкспериментировать с редактированием MDN перед тем, как сделать что-то «по-настоящему», можете потренироваться на странице в Песочнице. Пожалуйста, экспериментируйте только там. Не делайте ненужных изменений на обычных страницах, только чтобы посмотреть, что получится. Это добавляет работы другим.

        +

        Внимание: Если вы хотите поэкспериментировать с редактированием MDN перед тем, как сделать что-то «по-настоящему», можете потренироваться на странице в Песочнице. Пожалуйста, экспериментируйте только там. Не делайте ненужных изменений на обычных страницах, только чтобы посмотреть, что получится. Это добавляет работы другим.

        Когда закончите, смело приступайте к следующей задаче или посмотрите чуть ниже, какие ещё вещи можно сделать на MDN.

        Возможные типы задач

        -

        Есть несколько направлений, которые Вы можете выбрать, чтобы внести свой вклад в развитие MDN, в зависимости от квалификации и интересов. Даже если некоторые задачи покажутся сложными, у нас есть много других, простых и доступных. На решение большинства из них уйдёт не более пяти минут (а то и меньше!). Рядом с задачей и её кратким описанием Вы найдёте приблизительное время, за которое обычно решаются задачи данного типа.

        +

        Есть несколько направлений, которые вы можете выбрать, чтобы внести свой вклад в развитие MDN, в зависимости от квалификации и интересов. Даже если некоторые задачи покажутся сложными, у нас есть много других, простых и доступных. На решение большинства из них уйдёт не более пяти минут (а то и меньше!). Рядом с задачей и её кратким описанием вы найдёте приблизительное время, за которое обычно решаются задачи данного типа.

        Вариант 1: Мне нравятся слова

        @@ -54,7 +54,7 @@ translation_of: MDN/Contribute/Getting_started
      • Напишите статью, чтобы помочь людям узнать о Вебе (1-3 часа)
      -
      Примечание: Если Вы рецензируете статьи или пишете новые, мы просим ознакомиться с Инструкцией по оформлению. Это поможет статьям соответствовать правилам MDN.
      +
      Примечание: Если вы рецензируете статьи или пишете новые, мы просим ознакомиться с Инструкцией по оформлению. Это поможет статьям соответствовать правилам MDN.

      Вариант 2: Мне нравится писать код

      @@ -115,7 +115,7 @@ translation_of: MDN/Contribute/Getting_started Описание - По возможности, напишите, что Вам известно о проблеме и где найти корректную информацию. Это может быть человек или ссылки на веб-сайты с правильной информацией. + По возможности, напишите, что вам известно о проблеме и где найти корректную информацию. Это может быть человек или ссылки на веб-сайты с правильной информацией. diff --git a/files/ru/mdn/contribute/index.html b/files/ru/mdn/contribute/index.html index 2a5742d35c..ed913a6087 100644 --- a/files/ru/mdn/contribute/index.html +++ b/files/ru/mdn/contribute/index.html @@ -14,7 +14,7 @@ translation_of: MDN/Contribute
      {{IncludeSubnav("/ru/docs/MDN")}}
      -

      Добро пожаловать! Посетив эту страницу, Вы делаете первый шаг к тому, чтобы стать участником сообщества MDN!

      +

      Добро пожаловать! Посетив эту страницу, вы делаете первый шаг к тому, чтобы стать участником сообщества MDN!

      Здесь вы можете ознакомиться со статьями и руководством, которые описывают все аспекты участия в работе над MDN, в том числе руководства по стилю оформления, руководства по использованию текстового редактора и инструментов MDN и многое другое. Прежде чем редактировать или создавать какие-либо страницы, пожалуйста, убедитесь, что вы прочли (и согласны с) Mozilla Terms.

      diff --git a/files/ru/mdn/tools/kumascript/troubleshooting/index.html b/files/ru/mdn/tools/kumascript/troubleshooting/index.html index 27767d3872..06719f7886 100644 --- a/files/ru/mdn/tools/kumascript/troubleshooting/index.html +++ b/files/ru/mdn/tools/kumascript/troubleshooting/index.html @@ -45,7 +45,7 @@ original_slug: MDN/Kuma/Troubleshooting_KumaScript_errors
      -

      Совет: Вы можете легко и быстро перейти к определённому макросу, используя поиск по ключевым словам в Firefox. Смотрите {{SectionOnPage("/ru/docs/MDN/Contribute/Tools/KumaScript", "Использование поиска по ключевым словам для открытия шаблона страницы")}} для пошагового справочника по созданию поиска по ключевым словам.

      +

      Совет: вы можете легко и быстро перейти к определённому макросу, используя поиск по ключевым словам в Firefox. Смотрите {{SectionOnPage("/ru/docs/MDN/Contribute/Tools/KumaScript", "Использование поиска по ключевым словам для открытия шаблона страницы")}} для пошагового справочника по созданию поиска по ключевым словам.

      TemplateExecutionError

      diff --git a/files/ru/mozilla/add-ons/index.html b/files/ru/mozilla/add-ons/index.html index a647e86282..59da0a6b86 100644 --- a/files/ru/mozilla/add-ons/index.html +++ b/files/ru/mozilla/add-ons/index.html @@ -40,7 +40,7 @@ translation_of: Mozilla/Add-ons

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

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

      Где это возможно, рекомендуется выбирать Add-On SDK, который использует механизм расширения без необходимости перезапуска браузера (restartless extensions), а также упрощает разработку и убирает за собой. Если Вам недостаточно возможностей комплекта средств разработки Add-on SDK для реализации ваших идей, механизм restartless Вы можете осуществить самостоятельно. Технология Overlay extensions в целом устарела и не рекомендуется при разработке новых расширений.

      +

      Где это возможно, рекомендуется выбирать Add-On SDK, который использует механизм расширения без необходимости перезапуска браузера (restartless extensions), а также упрощает разработку и убирает за собой. Если вам недостаточно возможностей комплекта средств разработки Add-on SDK для реализации ваших идей, механизм restartless вы можете осуществить самостоятельно. Технология Overlay extensions в целом устарела и не рекомендуется при разработке новых расширений.

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

      @@ -48,22 +48,22 @@ translation_of: Mozilla/Add-ons

      Рекомендуемые практики

      -

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

      +

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

      Производительность
      -
      Убедитесь в том, что Ваше расширение обладает хорошей производительностью. Оно должно быть достаточно быстрым, иметь отзывчивый интерфейс и потреблять минимальный объем памяти.
      +
      Убедитесь в том, что ваше расширение обладает хорошей производительностью. Оно должно быть достаточно быстрым, иметь отзывчивый интерфейс и потреблять минимальный объем памяти.
      Безопасность
      -
      Убедитесь в том, что Ваше приложение не подвергает пользователя опасности на вредоносных веб сайтах.
      +
      Убедитесь в том, что ваше приложение не подвергает пользователя опасности на вредоносных веб сайтах.
      Этикет
      -
      Убедитесь в том, что Ваше расширение не конфликтует с другими расширениями.
      +
      Убедитесь в том, что ваше расширение не конфликтует с другими расширениями.

      Специфика разработки для различных приложений

      -

      Большая часть документации предполагает, что Вы разрабатываете для десктопной версии Firefox. Если Вы разрабатываете для других основанных на движке Gecko приложений, то существуют некоторые отличия, о которых Вам следует знать.

      +

      Большая часть документации предполагает, что вы разрабатываете для десктопной версии Firefox. Если вы разрабатываете для других основанных на движке Gecko приложений, то существуют некоторые отличия, о которых вам следует знать.

      Thunderbird
      diff --git a/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html b/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html index 6d1a808d7d..dace78d8ef 100644 --- a/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html +++ b/files/ru/mozilla/add-ons/webextensions/anatomy_of_a_webextension/index.html @@ -35,7 +35,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Anatomy_of_a_WebExtension

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

      -

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

      +

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

      Спецификации фоновых скриптов

      diff --git a/files/ru/mozilla/add-ons/webextensions/api/runtime/getmanifest/index.html b/files/ru/mozilla/add-ons/webextensions/api/runtime/getmanifest/index.html index f506e54335..fe8c795858 100644 --- a/files/ru/mozilla/add-ons/webextensions/api/runtime/getmanifest/index.html +++ b/files/ru/mozilla/add-ons/webextensions/api/runtime/getmanifest/index.html @@ -36,7 +36,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/API/runtime/getManifest

      Совместимость с браузерами

      - +

      {{Compat("webextensions.api.runtime.getManifest")}}

      diff --git a/files/ru/mozilla/add-ons/webextensions/examples/index.html b/files/ru/mozilla/add-ons/webextensions/examples/index.html index e59d8c1f7f..7d2696be80 100644 --- a/files/ru/mozilla/add-ons/webextensions/examples/index.html +++ b/files/ru/mozilla/add-ons/webextensions/examples/index.html @@ -17,7 +17,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/Examples

      Некоторые примеры работают только на специальных доменах или страницах. Подробности о всех ограничениях представлены в файле readme каждого примера. По умолчанию ни один из примеров не работает в приватных окнах браузера, подробности смотрите в Extensions in Private Browsing.

      -

      Если Вы хотите попробовать эти примеры, клонируйте репозиторий, а после этого совершите одно из следующих действий:

      +

      Если вы хотите попробовать эти примеры, клонируйте репозиторий, а после этого совершите одно из следующих действий:

      1. Загрузите расширение из папки с его исходниками, используя функцию браузера Load Temporary Add-on. Расширение останется загруженным до следующего перезапуска Firefox.
      2. @@ -26,9 +26,9 @@ translation_of: Mozilla/Add-ons/WebExtensions/Examples
      -

      Важно: Пожалуйста, не публикуйте эти примеры Веб-расширений на addons.mozilla.org (AMO) - Вам не нужно подписывать примеры Веб-расширений для того, чтобы их запустить. Просто следуйте шагам, описанным выше.

      +

      Важно: Пожалуйста, не публикуйте эти примеры Веб-расширений на addons.mozilla.org (AMO) - вам не нужно подписывать примеры Веб-расширений для того, чтобы их запустить. Просто следуйте шагам, описанным выше.

      -

      Если Вы хотите сделать свой вклад в репозиторий, отправьте нам pull request!

      +

      Если вы хотите сделать свой вклад в репозиторий, отправьте нам pull request!

      {{WebExtAllExamples}}

      diff --git a/files/ru/mozilla/add-ons/webextensions/internationalization/index.html b/files/ru/mozilla/add-ons/webextensions/internationalization/index.html index cf2fbd74e3..cc858907f9 100644 --- a/files/ru/mozilla/add-ons/webextensions/internationalization/index.html +++ b/files/ru/mozilla/add-ons/webextensions/internationalization/index.html @@ -9,7 +9,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац

      API WebExtensions предоставляет полезный модуль для интернационализации расширений — i18n. В этой статье мы рассмотрим его особенности и пример его работы. Система для расширений, построенных с помощью API WebExtension, i18n похожа на библиотеки JavaScript для i18n, такие как i18n.js.

      -

      Расширение, используемое в этой статье в качестве примера, — notify-link-clicks-i18n — доступно на GitHub. Читая последующие секции этой статьи, Вы можете исследовать его исходный код.

      +

      Расширение, используемое в этой статье в качестве примера, — notify-link-clicks-i18n — доступно на GitHub. Читая последующие секции этой статьи, вы можете исследовать его исходный код.

      Структура интернализированного расширения

      @@ -69,7 +69,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац
      Вы можете определить тэг языка при помощи инструмента Find  на странице определения языковых тегов. Обратите внимание на то, что при поиске нужно использовать английское название языка
      -

      Каждая система i18n требует предоставить строки во всех локализациях, которые Вы хотите поддерживать. В расширениях они хранятся в директории  _locales, размещённой внутри корневой директории. Строки каждой локализации (также называемые сообщениями) хранятся в файле messages.json, находящемся в поддиректории _locales, название которой - тег языка локализации.

      +

      Каждая система i18n требует предоставить строки во всех локализациях, которые вы хотите поддерживать. В расширениях они хранятся в директории  _locales, размещённой внутри корневой директории. Строки каждой локализации (также называемые сообщениями) хранятся в файле messages.json, находящемся в поддиректории _locales, название которой - тег языка локализации.

      Стоит заметить, что если тег включает в себя и базовый язык, и его региональный вариант, то по конвенции эти язык и вариант разделяются дефисом: например, "en-US". Однако в поддиректориях _locales, вместо дефиса используется нижнее подчёркивание: "en_US".

      @@ -108,7 +108,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац

      Это стандартный файл JSON — каждый из его элементов является объектом с именем, содержащим сообщение (message) и описание (description). Оба предмета - строки; $URL$ — это заполнитель, который заменяется подстрокой, когда элемент notificationContent вызывается расширением. Вы научитесь это делать в секции {{anch("Получение сообщений из JavaScript")}}.

      -

      Примечание: Вы можете найти больше информации о структуре messages.json здесь.

      +

      Примечание: вы можете найти больше информации о структуре messages.json здесь.

      Интернационализация manifest.json

      @@ -117,7 +117,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац

      Получение локализованных строк в манифестах

      -

      Ваш файл manifest.json содержит строки, отображаемые пользователю, такие как имя и описание расширения. Если Вы интернационализируете эти строки и поместите их переводы в messages.json, то эти переводы будут отображаться пользователю в зависимости от локализации его браузера.

      +

      Ваш файл manifest.json содержит строки, отображаемые пользователю, такие как имя и описание расширения. Если вы интернационализируете эти строки и поместите их переводы в messages.json, то эти переводы будут отображаться пользователю в зависимости от локализации его браузера.

      Чтобы интернационализировать строки, их нужно указывать следующим образом:

      @@ -148,7 +148,7 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац

      CSS, зависящий от локализации

      -

      Локализованные строки также можно получить из CSS-файлов расширения. Например, Вы можете создать поля CSS, зависящие от локализации, так:

      +

      Локализованные строки также можно получить из CSS-файлов расширения. Например, вы можете создать поля CSS, зависящие от локализации, так:

      header {
         background-image: url(../images/__MSG_extensionName__/header.png);
      @@ -158,11 +158,11 @@ original_slug: Mozilla/Add-ons/WebExtensions/Интернационализац
       
       

      Получение сообщений из JavaScript

      -

      Допустим, Вы добавили сообщения в Ваш manifest.json. Чтобы Ваше расширение начало использовать правильные языки, соответствующие сообщения следует вызывать при помощи JavaScript. API i18n достаточно прост и содержит всего 4 основных метода:

      +

      Допустим, вы добавили сообщения в ваш manifest.json. Чтобы ваше расширение начало использовать правильные языки, соответствующие сообщения следует вызывать при помощи JavaScript. API i18n достаточно прост и содержит всего 4 основных метода:

        -
      • Скорее всего, наиболее часто Вы будете использовать {{WebExtAPIRef("i18n.getMessage()")}} — этот метод используется для получения конкретного сообщения. Примеры его использования можно увидеть ниже.
      • -
      • Методы {{WebExtAPIRef("i18n.getAcceptLanguages()")}} и {{WebExtAPIRef("i18n.getUILanguage()")}} используются, если UI надо менять в зависимости от локализации — например, если Вы хотите, чтобы предпочтения, свойственные носителям какого-либо языка, находились выше в списке, или чтобы формат дат соответствовал локализации браузера.
      • +
      • Скорее всего, наиболее часто вы будете использовать {{WebExtAPIRef("i18n.getMessage()")}} — этот метод используется для получения конкретного сообщения. Примеры его использования можно увидеть ниже.
      • +
      • Методы {{WebExtAPIRef("i18n.getAcceptLanguages()")}} и {{WebExtAPIRef("i18n.getUILanguage()")}} используются, если UI надо менять в зависимости от локализации — например, если вы хотите, чтобы предпочтения, свойственные носителям какого-либо языка, находились выше в списке, или чтобы формат дат соответствовал локализации браузера.
      • Метод {{WebExtAPIRef("i18n.detectLanguage()")}} используется для получения языка информации, введённой пользователем, и её форматирования.
      @@ -185,7 +185,7 @@ var content = browser.i18n.getMessage("notificationContent", message.url);
      } -

      Объект "placeholders"  определяет все заполнители и то, откуда их нужно получать. Заполнитель "url" указывает, что информация о нем должна содержаться в $1 — первое значение, заданное внутри второго параметра getMessage(). Поскольку заполнитель называется "url",  $URL$ используется для его вызова внутри сообщения (то есть для заполнителя "name" нужно использовать $NAME$, и т. д.). Если Вы хотите задать значения нескольких заполнителей, их можно передавать во второй аргумент {{WebExtAPIRef("i18n.getMessage()")}} в виде массива — массив [a, b, c] передаёт значения $1, $2 и $3, и т. д. внутрь messages.json.

      +

      Объект "placeholders"  определяет все заполнители и то, откуда их нужно получать. Заполнитель "url" указывает, что информация о нем должна содержаться в $1 — первое значение, заданное внутри второго параметра getMessage(). Поскольку заполнитель называется "url",  $URL$ используется для его вызова внутри сообщения (то есть для заполнителя "name" нужно использовать $NAME$, и т. д.). Если вы хотите задать значения нескольких заполнителей, их можно передавать во второй аргумент {{WebExtAPIRef("i18n.getMessage()")}} в виде массива — массив [a, b, c] передаёт значения $1, $2 и $3, и т. д. внутрь messages.json.

      Давайте посмотрим на пример: изначально сообщение notificationContent в файле en/messages.json такое:

      @@ -208,7 +208,7 @@ var content = browser.i18n.getMessage("notificationContent", message.url);

      Заданные замены

      -

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

      +

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

      "mdn_banner": {
         "message": "For more information on web technologies, go to $MDN$.",
      @@ -220,7 +220,7 @@ var content = browser.i18n.getMessage("notificationContent", message.url);
      } } -

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

      +

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

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

      @@ -373,20 +373,20 @@ padding-left: 1.5em;

      Тестирование расширения

      -

      Начиная с Firefox 45, расширения могут быть временно установлены с диска — подробнее об этом написано в статье Loading from disk. Сделайте это и попробуйте протестировать наше расширение notify-link-clicks-i18n. Перейдите на одну из Ваших любимых страниц и нажмите на ссылку, чтобы проверить, появляется ли сообщения, содержащее URL нажатой ссылки.

      +

      Начиная с Firefox 45, расширения могут быть временно установлены с диска — подробнее об этом написано в статье Loading from disk. Сделайте это и попробуйте протестировать наше расширение notify-link-clicks-i18n. Перейдите на одну из ваших любимых страниц и нажмите на ссылку, чтобы проверить, появляется ли сообщения, содержащее URL нажатой ссылки.

      -

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

      +

      Затем измените локализацию Firefox на какую-либо поддерживающуюся расширением, которое вы хотите протестировать.

      1. Откройте "about:config" в Firefox, и найдите параметр intl.locale.requested (обратите внимание на версию Firefox: в версиях до Firefox 59 этот параметр называется general.useragent.locale).
      2. -
      3. Если параметр существует, нажмите на него дважды (или нажмите Return/Enter), чтобы выбрать его, введите языковой код локализации, которую Вы хотите протестировать и нажмите "OK" (или Return/Enter). Например, в нашем примере расширение поддерживает "en" (английский), "de" (немецкий), "nl" (голландский), and "ja" (японский). Вы также можете указать пустую строку ("") в качестве значения. В этом случае браузер выберет язык Вашей ОС по умолчанию.
      4. +
      5. Если параметр существует, нажмите на него дважды (или нажмите Return/Enter), чтобы выбрать его, введите языковой код локализации, которую вы хотите протестировать и нажмите "OK" (или Return/Enter). Например, в нашем примере расширение поддерживает "en" (английский), "de" (немецкий), "nl" (голландский), and "ja" (японский). Вы также можете указать пустую строку ("") в качестве значения. В этом случае браузер выберет язык вашей ОС по умолчанию.
      6. Если параметр intl.locale.requested не существует, нажмите правой кнопкой мыши на список параметров (или откройте контекстное меню при помощи клавиатуры), и выберите "New", а затем "String". Введите intl.locale.requested как имя настройки и, "de", "nl", и т. д. как значение, как это описано в шаге 2.
      7. Найдите intl.locale.matchOS и, если параметр существует и равен true, дважды нажмите на него и установите на false.
      8. Перезапустите браузер, чтобы изменения вступили в силу.
      -

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

      +

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

        @@ -399,8 +399,8 @@ padding-left: 1.5em;

        Ещё раз загрузите расширение с диска и протестируйте локализацию:

          -
        • Ещё раз откройте "about:addons" — теперь Вы должны увидеть Ваше расширение, его иконку, имя и описание на выбранном языке.
        • -
        • Ещё раз протестируйте расширение. Для нашего примера, Вам следовало бы посетить другую страницу и, нажав на ссылку, проверить, появляется ли сообщение на нужном языке.
        • +
        • Ещё раз откройте "about:addons" — теперь вы должны увидеть ваше расширение, его иконку, имя и описание на выбранном языке.
        • +
        • Ещё раз протестируйте расширение. Для нашего примера, вам следовало бы посетить другую страницу и, нажав на ссылку, проверить, появляется ли сообщение на нужном языке.

        {{EmbedYouTube("R7--fp5pPGg")}}

        diff --git a/files/ru/mozilla/add-ons/webextensions/manifest.json/index.html b/files/ru/mozilla/add-ons/webextensions/manifest.json/index.html index 2c964efad0..cd4f1e2fb8 100644 --- a/files/ru/mozilla/add-ons/webextensions/manifest.json/index.html +++ b/files/ru/mozilla/add-ons/webextensions/manifest.json/index.html @@ -13,12 +13,12 @@ translation_of: Mozilla/Add-ons/WebExtensions/manifest.json

        {{AddonSidebar}}

        -

        В этой статье описан файл manifest.json для веб-расширений. Если Вы ищете информацию о manifest.json для Прогрессивных веб-приложений (PWAs), смотрите статью Манифест веб-приложения.

        +

        В этой статье описан файл manifest.json для веб-расширений. Если вы ищете информацию о manifest.json для Прогрессивных веб-приложений (PWAs), смотрите статью Манифест веб-приложения.

        Файл manifest.json это единственный файл, который обязательно должен быть в каждом расширении, использующем API Веб-расширения (WebExtension APIs).

        -

        Используя manifest.json, Вы определяете базовые метаданные о расширении, такие как имя и версия. Также можно определить некоторые аспекты функциональности (такие, как фоновые скрипты, контент скрипты и действия браузера).

        +

        Используя manifest.json, вы определяете базовые метаданные о расширении, такие как имя и версия. Также можно определить некоторые аспекты функциональности (такие, как фоновые скрипты, контент скрипты и действия браузера).

        Это файл в формате JSON, но в нём можно использовать комментарии, каждая строка которых должна начинаться с "//".

        @@ -130,7 +130,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/manifest.json

        Для полного обзора всех полей манифеста и их содержимого, смотрите полную таблицу совместимости manifest.json с браузерами.

        - +

        {{Compat("webextensions.manifest")}}

        diff --git a/files/ru/mozilla/add-ons/webextensions/user_interface/extension_pages/index.html b/files/ru/mozilla/add-ons/webextensions/user_interface/extension_pages/index.html index fdb63f2252..693c0d3ce6 100644 --- a/files/ru/mozilla/add-ons/webextensions/user_interface/extension_pages/index.html +++ b/files/ru/mozilla/add-ons/webextensions/user_interface/extension_pages/index.html @@ -66,7 +66,7 @@ browser.history.onVisited.addListener(onVisited);

        Дизайн веб-страницы

        -

        Подробности о том, как сделать, чтобы дизайн Ваших страниц совпадал со стилем Firefox, смотрите на сайте Система дизайна Photon (на английском языке) и в документации browser styles.

        +

        Подробности о том, как сделать, чтобы дизайн ваших страниц совпадал со стилем Firefox, смотрите на сайте Система дизайна Photon (на английском языке) и в документации browser styles.

        Примеры

        diff --git a/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html b/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html index cae5ec254f..fe23e57bed 100644 --- a/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html +++ b/files/ru/mozilla/add-ons/webextensions/what_are_webextensions/index.html @@ -65,7 +65,7 @@ translation_of: Mozilla/Add-ons/WebExtensions/What_are_WebExtensions
        -

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

        +

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

        То, как интегрируется aXe в инструменты разработчика Firefox
        diff --git a/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html b/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html index 4e55db9d08..83de4bd68b 100644 --- a/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html +++ b/files/ru/mozilla/add-ons/webextensions/your_first_webextension/index.html @@ -84,14 +84,14 @@ cd borderify

        Создайте директорию (папку) "icons" внутри директории "borderify" . Сохраните в ней иконку под именем "border-48.png".  Вы можете использовать иконку из нашего примера, которая взята из набора иконок Google Material Design, и используется по лицензии Creative Commons Attribution-ShareAlike.

        -

        Вы можете использовать собственную иконку. Её размер должен быть 48x48 пикселей. Вы можете также использовать иконку размером 96x96 пикселей для отображения на мониторах высокого разрешения. В этом случае Вам необходимо указать её в качестве свойства "96" объекта "icons" в файле manifest.json:

        +

        Вы можете использовать собственную иконку. Её размер должен быть 48x48 пикселей. Вы можете также использовать иконку размером 96x96 пикселей для отображения на мониторах высокого разрешения. В этом случае вам необходимо указать её в качестве свойства "96" объекта "icons" в файле manifest.json:

        "icons": {
           "48": "icons/border-48.png",
           "96": "icons/border-96.png"
         }
        -

        Также Вы можете создать иконку в формате SVG и она будет корректно масштабироваться.

        +

        Также вы можете создать иконку в формате SVG и она будет корректно масштабироваться.

        • Узнать больше о ключе icons
        • @@ -111,7 +111,7 @@ cd borderify

          Пробуем

          -

          Сначала внимательно проверьте, что Вы правильно разместили файлы и дали им правильные имена:

          +

          Сначала внимательно проверьте, что вы правильно разместили файлы и дали им правильные имена:

          borderify/
               icons/
          @@ -121,7 +121,7 @@ cd borderify

          Установка

          -

          Начиная с версии Firefox 45 Вы можете временно установить WebExtension с локального диска.

          +

          Начиная с версии Firefox 45 вы можете временно установить WebExtension с локального диска.

          Откройте страницу "about:debugging", кликните "Load Temporary Add-on" и выберите файл manifest.json:

          @@ -133,7 +133,7 @@ cd borderify

          {{EmbedYouTube("WpUL3-qmenE")}}

          -

          Также, Вы можете запускать WebExtension из командной строки, используя web-ext.

          +

          Также, вы можете запускать WebExtension из командной строки, используя web-ext.

          Тестирование

          diff --git a/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html b/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html index c8b345e24f..9cd42e3788 100644 --- a/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html +++ b/files/ru/mozilla/add-ons/webextensions/your_second_webextension/index.html @@ -9,7 +9,7 @@ tags: translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension ---
          {{AddonSidebar}} -

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

          +

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

          Дополнение добавляет новую кнопку на панель инструментов Firefox. Когда пользователь кликает по кнопке, мы показываем ему всплывающую панель с предложением выбрать животное. Когда животное выбрано, мы заменяем содержимое текущей страницы на изображение выбранного животного.

          @@ -41,12 +41,12 @@ translation_of: Mozilla/Add-ons/WebExtensions/Your_second_WebExtension
        • определение всплывающей панели используя HTML, CSS, и JavaScript
        • встраивание контент-скрипта в веб-страницы
        • взаимодействие между сценарием содержимого и остальным дополнением
        • -
        • упаковка ресурсов с Вашим дополнением, которые будут использованы веб-страницами
        • +
        • упаковка ресурсов с вашим дополнением, которые будут использованы веб-страницами

        Вы можете найти полный исходный код дополнения на GitHub.

        -

        Чтобы написать это дополнение, Вам нужен Firefox 45 или новее.

        +

        Чтобы написать это дополнение, вам нужен Firefox 45 или новее.

        Написание WebExtension

        @@ -93,13 +93,13 @@ cd beastify
        • Первые три ключа: manifest_version, name, и version, являются обязательными и содержат основные мета-данные для дополнения.
        • description и homepage_url необязательны, но рекомендуемы: они предоставляют полезную информацию о дополнении.
        • -
        • icons необязательный, но рекомендуемый: позволяет Вам определять иконку для дополнения, которая будет показана в Менеджере Дополнений.
        • +
        • icons необязательный, но рекомендуемый: позволяет вам определять иконку для дополнения, которая будет показана в Менеджере Дополнений.
        • permissions перечисляет разрешения для нужд дополнения. Здесь мы просто спрашиваем разрешения для activeTab permission.
        • browser_action задаёт кнопку на панели инструментов. Здесь мы предоставляем три вида информации:
          • default_icon это обязательная иконка для кнопки
          • default_title необязательный заголовок, будет показан в подсказке
          • -
          • default_popup используется, если Вы хотите, чтобы всплывающая панель была показана когда пользователь кликает по кнопке. В нашем примере мы использовали этот ключ и он указывает на HTML файл, подключённый к дополнению.
          • +
          • default_popup используется, если вы хотите, чтобы всплывающая панель была показана когда пользователь кликает по кнопке. В нашем примере мы использовали этот ключ и он указывает на HTML файл, подключённый к дополнению.
        • web_accessible_resources перечисляет файлы, которые мы хотим сделать доступными для веб-страниц. Поскольку дополнение заменяет содержимое страницы на изображения, которые мы упаковали вместе с дополнением, нам нужно сделать эти изображения доступными для страницы.
        • @@ -113,7 +113,7 @@ cd beastify

          Создайте папку "icons" и сохраните там иконку с именем "beasts-48.png". Вы можете использовать иконку из нашего примера, которая взята из набора Aha-Soft’s Free Retina и используется на условиях этой лицензии.

          -

          Если Вы выберете свою иконку, она должна быть размером 48x48 пикселей. Вы также можете предоставить иконку размером 96x96 пикселей для дисплеев с высоким разрешением, определив свойство "96" объекта icons в файле manifest.json:

          +

          Если вы выберете свою иконку, она должна быть размером 48x48 пикселей. Вы также можете предоставить иконку размером 96x96 пикселей для дисплеев с высоким разрешением, определив свойство "96" объекта icons в файле manifest.json:

          "icons": {
             "48": "icons/beasts-48.png",
          @@ -126,7 +126,7 @@ cd beastify

          Сохраните иконку с именем "beasts-32.png" в папке "icons". Вы можете использовать иконку из нашего примера, которая взята из набора IconBeast Lite и используется на условиях этой лицензии.

          -

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

          +

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

          Всплывающая панель

          @@ -344,9 +344,9 @@ browser.runtime.onMessage.addListener(beastify); manifest.json -

          Начиная с Firefox 45 Вы можете временно установить дополнения с жёсткого диска.

          +

          Начиная с Firefox 45 вы можете временно установить дополнения с жёсткого диска.

          -

          Откройте "about:debugging" в Firefox, кликните "Загрузить временное дополнение", и выберете Ваш файл manifest.json. После этого Вы должны увидеть иконку дополнения на панели инструментов Firefox:

          +

          Откройте "about:debugging" в Firefox, кликните "Загрузить временное дополнение", и выберете ваш файл manifest.json. После этого вы должны увидеть иконку дополнения на панели инструментов Firefox:

          {{EmbedYouTube("sAM78GU4P34")}}

          diff --git a/files/ru/mozilla/developer_guide/index.html b/files/ru/mozilla/developer_guide/index.html index 81ec0a3996..e3e72b7b11 100644 --- a/files/ru/mozilla/developer_guide/index.html +++ b/files/ru/mozilla/developer_guide/index.html @@ -3,7 +3,7 @@ title: Инструкция разработчика slug: Mozilla/Developer_guide translation_of: Mozilla/Developer_guide --- -

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

          +

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

          @@ -26,7 +26,7 @@ translation_of: Mozilla/Developer_guide
          Автоматизированное тестирование
          Как запустить автоматизированный процесс тестирования Mozilla,  и как писать новые тесты.
          Как внести исправления/дополнения в исходный код
          -
          После написания патча, Вам нужно внести его в дерево исходных кодов в репозитории. Эта статья объясняет как происходит процесс проверки присланного кода патча и как добиться чтобы Ваш патч приняли.
          +
          После написания патча, вам нужно внести его в дерево исходных кодов в репозитории. Эта статья объясняет как происходит процесс проверки присланного кода патча и как добиться чтобы ваш патч приняли.
          Обновление документации
          Как убедиться что документация не устарела и соответствует тому что она описывает.
          Модули Mozilla и владение модулями
          @@ -38,7 +38,7 @@ translation_of: Mozilla/Developer_guide
          Отладка
          Полезные подсказки и руководства по отладке исходного кода Mozilla.
          Производительность
          -
          Руководство по производительности и описание утилит которые помогут Вам сделать Ваш код более быстрым.
          +
          Руководство по производительности и описание утилит которые помогут вам сделать ваш код более быстрым.
          Платформа Mozilla
          Информация о работе на платформе Mozilla.
          Добавление API к объекту navigator {{ gecko_minversion_inline("9.0") }}
          @@ -50,7 +50,7 @@ translation_of: Mozilla/Developer_guide
          Виртуальное окружение в ARM Linux
          Как настроить ARM эмулятор с запущенным Linux, чтобы протестировать ARM специфичный код. Эта часть будет полезной для разработчиков  мобильных устройств.
          Устаревшие подсказки и советы для сборки
          -
          Это место куда складывают уже устаревшие подсказки, которые не нужны если Вам требуется собрать из исходного кода последней версии, но тем не менее они могут быть полезны если Вы работаете со старыми версиями.
          +
          Это место куда складывают уже устаревшие подсказки, которые не нужны если вам требуется собрать из исходного кода последней версии, но тем не менее они могут быть полезны если вы работаете со старыми версиями.
          Firefox Source Docs
          Web-hosted documentation built from the mozilla-central source code.
          diff --git a/files/ru/mozilla/developer_guide/introduction/index.html b/files/ru/mozilla/developer_guide/introduction/index.html index 7021db01c6..1706f99902 100644 --- a/files/ru/mozilla/developer_guide/introduction/index.html +++ b/files/ru/mozilla/developer_guide/introduction/index.html @@ -16,9 +16,9 @@ original_slug: Introduction_(alternate)

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

        Веб сайты

        -

        Mozilla имеет более 100 различных веб-проектов и инструментов, почти все из которых - проекты с открытым кодом. Есть ресурсы getting started with Mozilla's main web sites, а также mostly-up-to-date list of web development projects с участием Mozilla, и мы постоянно стремимся расширять этот список. В этих списках Вы найдёте много интересных проектов и узнаете, как помочь их развитию.

        +

        Mozilla имеет более 100 различных веб-проектов и инструментов, почти все из которых - проекты с открытым кодом. Есть ресурсы getting started with Mozilla's main web sites, а также mostly-up-to-date list of web development projects с участием Mozilla, и мы постоянно стремимся расширять этот список. В этих списках вы найдёте много интересных проектов и узнаете, как помочь их развитию.

        Проекты на гитхабе

        -

        Mozilla github страница содержит более 100 проектов, в которых Вы можете принять участие. Эти проекты разрабатываются с использованием обычной GitHub практики, так что для начала работы над каким-либо проектом Вам нужно лишь форкнуть его. Мы с нетерпением ждём Ваших запросов на мёрдж! Среди этих проектов есть и такие высоко-профильные, как Jetpack и многие другие.

        +

        Mozilla github страница содержит более 100 проектов, в которых вы можете принять участие. Эти проекты разрабатываются с использованием обычной GitHub практики, так что для начала работы над каким-либо проектом вам нужно лишь форкнуть его. Мы с нетерпением ждём Ваших запросов на мёрдж! Среди этих проектов есть и такие высоко-профильные, как Jetpack и многие другие.

        Mozilla Mercurial репозитории

        Многие Mozilla-проекты лежат в своих собственных репозиториях на hg.mozilla.org. Там можно увидеть иерархию директорий проектов, а также какие из них в настоящее время поддерживается (подсказка - не все из них!). В числе таких проектов - многие основные сферы деятельности Mozilla, такие как QA, RelEng, localization, webtools, core developers' user repos и другие.

        Другие способы принять участие

        diff --git a/files/ru/mozilla/developer_guide/mozilla-central/index.html b/files/ru/mozilla/developer_guide/mozilla-central/index.html index 3df77530f4..b0712aa913 100644 --- a/files/ru/mozilla/developer_guide/mozilla-central/index.html +++ b/files/ru/mozilla/developer_guide/mozilla-central/index.html @@ -9,7 +9,7 @@ translation_of: Mozilla/Developer_guide/mozilla-central

        Продвижение изменений в mozilla-central

        -

        Посмотрите "Как я загружаю материал?" для справки hg commit и hg push. Если Вы хотите иметь доступ к mozilla-central, но не знаете Ваших данных для входа в систему, сообщите об ошибке.

        +

        Посмотрите "Как я загружаю материал?" для справки hg commit и hg push. Если вы хотите иметь доступ к mozilla-central, но не знаете ваших данных для входа в систему, сообщите об ошибке.

        Occasionally, e.g. just before branch points, mozilla-central also has special tree rules.  The Tinderbox page for mozilla-central is located at http://tinderbox.mozilla.org/showbui...i?tree=Firefox.

        diff --git a/files/ru/mozilla/developer_guide/so_you_just_built_firefox/index.html b/files/ru/mozilla/developer_guide/so_you_just_built_firefox/index.html index 0d270fb9b9..6c95f800d1 100644 --- a/files/ru/mozilla/developer_guide/so_you_just_built_firefox/index.html +++ b/files/ru/mozilla/developer_guide/so_you_just_built_firefox/index.html @@ -1,5 +1,5 @@ --- -title: 'Итак, Вы только что построили Firefox' +title: 'Итак, вы только что построили Firefox' slug: Mozilla/Developer_guide/So_you_just_built_Firefox translation_of: Mozilla/Developer_guide/So_you_just_built_Firefox --- diff --git a/files/ru/mozilla/firefox/releases/43/index.html b/files/ru/mozilla/firefox/releases/43/index.html index f03fccb0bd..a30ce1b815 100644 --- a/files/ru/mozilla/firefox/releases/43/index.html +++ b/files/ru/mozilla/firefox/releases/43/index.html @@ -90,7 +90,7 @@ translation_of: Mozilla/Firefox/Releases/43
        • Battery Status API теперь использует новый синтаксис промисов для {{domxref("Navigator.getBattery()")}}, так как это описано в последней версии спецификации ({{bug(1050749)}}).
        • Заголовок User-Agent более не в списке {{Glossary("Forbidden_header_name", "forbidden header names", 1)}} и теперь может быть установлен в объект Fetch {{domxref("Headers")}}, через XHR {{domxref("XMLHttpRequest.setRequestHeader()")}},… ({{bug(1188932)}}).
        • -
        • Конструктор {{domxref("MediaRecorder.MediaRecorder()")}} теперь принимает дополнительно необязательный  параметр типа словарь (dictionary), который позволяет Вам устанавливать произвольный битрейт для записываемого аудио/видео ({{bug("1161276")}}).
        • +
        • Конструктор {{domxref("MediaRecorder.MediaRecorder()")}} теперь принимает дополнительно необязательный  параметр типа словарь (dictionary), который позволяет вам устанавливать произвольный битрейт для записываемого аудио/видео ({{bug("1161276")}}).
        • Реализован интерфейс {{domxref("PerformanceObserver")}}, из Performance Timeline API ({{bug(1165796)}}).
        • Добавлены дополнительно два интерфейса в Frame Timing API, {{domxref("PerformanceRenderTiming")}} и {{domxref("PerformanceCompositeTiming")}} ({{bug(1191178)}}).
        • Реализована современная версия Screen Orientation API: доступны беспрефиксные интерфейсы {{domxref("Screen.orientation")}} и {{domxref("ScreenOrientation")}} ({{bug("1131470")}}). Не стандартные {{domxref("Screen.mozOrientation")}}, {{domxref("Screen.onmozorientationchange")}}, {{domxref("Screen.mozLockOrientation()")}}, и {{domxref("Screen.mozUnlockOrientation()")}} будут удалены в будущем.
        • diff --git a/files/ru/orphaned/mdn/community/working_in_community/index.html b/files/ru/orphaned/mdn/community/working_in_community/index.html index 833bcdc4f0..e5f8461125 100644 --- a/files/ru/orphaned/mdn/community/working_in_community/index.html +++ b/files/ru/orphaned/mdn/community/working_in_community/index.html @@ -39,11 +39,11 @@ original_slug: MDN/Сообщество/Working_in_community

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

          -

          Привет, MrBigglesworth, я заметил Ваш вклад в документацию API Wormhole, Ваша помощь неоценима! Мне особенно нравится, как Вы сбалансировали свой уровень детализации с удобочитаемостью. Тем не менее, Вы могли бы сделать эти статьи ещё лучше и полезнее, если бы в дальнейшем добавили правильные теги к страницам.

          +

          Привет, MrBigglesworth, я заметил ваш вклад в документацию API Wormhole, ваша помощь неоценима! Мне особенно нравится, как Вы сбалансировали свой уровень детализации с удобочитаемостью. Тем не менее, вы могли бы сделать эти статьи ещё лучше и полезнее, если бы в дальнейшем добавили правильные теги к страницам.

          Подробные сведения смотри в руководстве по тегам MDN (https://developer.mozilla.org/en-US/docs/MDN/Contribute/Howto/Tag).

          -

          Ещё раз спасибо, я надеюсь на Ваше сотрудничество в будущем!

          +

          Ещё раз спасибо, я надеюсь на ваше сотрудничество в будущем!

          Обмен знаниями

          diff --git a/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html b/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html index de9763f692..65f0c33fca 100644 --- a/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/do_a_technical_review/index.html @@ -21,10 +21,10 @@ original_slug: MDN/Contribute/Howto/Do_a_technical_review
          Обзор и исправление статей на техническую точность и полноту.
          Где это необходимо сделать?
          В конкретных статьях, которые отмечены как требующие технического обзора.
          -
          Что Вы должны знать, чтобы выполнить задачу?
          +
          Что вы должны знать, чтобы выполнить задачу?
            -
          • Экспертные знания в теме, которую Вы обозреваете.
          • +
          • Экспертные знания в теме, которую вы обозреваете.
          • Возможность редактирования статьи на MDN.
          @@ -34,19 +34,19 @@ original_slug: MDN/Contribute/Howto/Do_a_technical_review
        • Выберите статью для обзора:
          1. Перейдите к списку страниц, которые нуждаются в техническом обзоре. В этом списке перечислены все страницы, для которых был запрошен технический обзор.
          2. -
          3. Выберите страницу, с темой которой Вы очень хорошо знакомы.
          4. +
          5. Выберите страницу, с темой которой вы очень хорошо знакомы.
          6. Нажмите на ссылку статьи, чтобы загрузить страницу.
        • -
        • Прочитайте статью, обращая пристально внимание на технические детали: Верна ли статья? Чего-то не хватает? Не стесняйтесь переключаться на другую статью, если выбранная не устраивает Вас.
        • -
        • Если ошибок нет, то Вам не нужно редактировать статью, чтобы отметить её как просмотренную. Посмотрите на окно "быстрого обзора" в левой боковой панели страницы:
          +
        • Прочитайте статью, обращая пристально внимание на технические детали: Верна ли статья? Чего-то не хватает? Не стесняйтесь переключаться на другую статью, если выбранная не устраивает вас.
        • +
        • Если ошибок нет, то вам не нужно редактировать статью, чтобы отметить её как просмотренную. Посмотрите на окно "быстрого обзора" в левой боковой панели страницы:

          Выберите флажок Технический и нажмите Обзор завершён.
        • -
        • Если Вы нашли ошибки, которые нужно исправить: +
        • Если вы нашли ошибки, которые нужно исправить:
            -
          1. Нажмите кнопку Редактировать в верхней части страницы; она переместит Вас в редактор MDN.
          2. +
          3. Нажмите кнопку Редактировать в верхней части страницы; она переместит вас в редактор MDN.
          4. Исправьте неверную техническую информацию и добавьте важную информацию, которая отсутствует.
          5. -
          6. Введите Комментарий к ревизии в нижней части статьи, который описывает, что Вы сделали, например, "Технический обзор закончен". Если Вы исправляли информацию, добавьте это в Ваш комментарий, например, "Технический обзор: исправлено описание параметров".
          7. +
          8. Введите Комментарий к ревизии в нижней части статьи, который описывает, что вы сделали, например, "Технический обзор закончен". Если вы исправляли информацию, добавьте это в ваш комментарий, например, "Технический обзор: исправлено описание параметров".
          9. Отмените флажок Технический под Требуется проверка?.
          10. Нажмите кнопку Сохранить изменения.
          diff --git a/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html b/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html index 1a29be1318..8a02e511fa 100644 --- a/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html +++ b/files/ru/orphaned/mdn/contribute/howto/do_an_editorial_review/index.html @@ -19,7 +19,7 @@ original_slug: MDN/Contribute/Howto/Do_an_editorial_review
          Техническое редактирование и исправление статей, которые отмечены как требующие редакционного обзора.
          Где это необходимо сделать?
          В конкретных статьях, которые отмечены как требующие редакционного обзора.
          -
          Что Вы должны знать, чтобы выполнить задачу?
          +
          Что вы должны знать, чтобы выполнить задачу?
          Вы должны иметь хорошие грамматические и орфографические навыки в русском языке.
          Какие действия нужно выполнить, чтобы сделать это?
          @@ -31,14 +31,14 @@ original_slug: MDN/Contribute/Howto/Do_an_editorial_review
        • Нажмите на ссылку статьи, чтобы загрузить страницу.
      -
    • Прочитайте статью, обращая пристальное внимание на опечатки и орфографические, грамматические или оборотные ошибки. Не стесняйтесь переключаться на другую статью, если выбранная не устраивает Вас.
    • -
    • Если ошибок нет, то Вам не нужно редактировать статью, чтобы отметить её как прошедшую корректуру. Посмотрите на окно "быстрого обзора" в левой боковой панели страницы:
      +
    • Прочитайте статью, обращая пристальное внимание на опечатки и орфографические, грамматические или оборотные ошибки. Не стесняйтесь переключаться на другую статью, если выбранная не устраивает вас.
    • +
    • Если ошибок нет, то вам не нужно редактировать статью, чтобы отметить её как прошедшую корректуру. Посмотрите на окно "быстрого обзора" в левой боковой панели страницы:

      Выберите флажок Редакционный и нажмите Обзор завершён.
    • -
    • Если Вы нашли ошибки, которые нужно исправить: +
    • Если вы нашли ошибки, которые нужно исправить:
        -
      1. Нажмите кнопку Редактировать в верхней части страницы; она переместит Вас в редактор MDN.
      2. -
      3. Исправьте все опечатки и орфографические, грамматические или оборотные ошибки, которые Вы видите.
      4. +
      5. Нажмите кнопку Редактировать в верхней части страницы; она переместит вас в редактор MDN.
      6. +
      7. Исправьте все опечатки и орфографические, грамматические или оборотные ошибки, которые вы видите.
      8. Введите Комментарий ревизии в нижней части статьи; что-то вроде 'Редакционный обзор: исправлены опечатки, грамматика и орфография'.
      9. Снимите флажок Редакционный под Требуется проверка?.
      10. Нажмите кнопку Сохранить изменения.
      11. @@ -47,7 +47,7 @@ original_slug: MDN/Contribute/Howto/Do_an_editorial_review
      -

      Из-за соображений производительности Ваши правки могут не сразу появиться на странице.

      +

      Из-за соображений производительности ваши правки могут не сразу появиться на странице.

      diff --git "a/files/ru/orphaned/\320\262\320\276\320\277\321\200\320\276\321\201\321\213_\320\261\320\265\320\267_\320\276\321\202\320\262\320\265\321\202\320\276\320\262/index.html" "b/files/ru/orphaned/\320\262\320\276\320\277\321\200\320\276\321\201\321\213_\320\261\320\265\320\267_\320\276\321\202\320\262\320\265\321\202\320\276\320\262/index.html" index da5847b2af..327822e640 100644 --- "a/files/ru/orphaned/\320\262\320\276\320\277\321\200\320\276\321\201\321\213_\320\261\320\265\320\267_\320\276\321\202\320\262\320\265\321\202\320\276\320\262/index.html" +++ "b/files/ru/orphaned/\320\262\320\276\320\277\321\200\320\276\321\201\321\213_\320\261\320\265\320\267_\320\276\321\202\320\262\320\265\321\202\320\276\320\262/index.html" @@ -6,4 +6,4 @@ tags: - Список вопросов original_slug: Вопросы_без_ответов --- -

      Здесь Вы можете оставить свой вопрос, на который Вы не нашли ответа. После того, как мы найдём на него ответ, вопрос будет перемещён на страницу Часто Задаваемых Вопросов.

      +

      Здесь вы можете оставить свой вопрос, на который вы не нашли ответа. После того, как мы найдём на него ответ, вопрос будет перемещён на страницу Часто Задаваемых Вопросов.

      diff --git "a/files/ru/orphaned/\321\201\320\261\320\276\321\200\320\272\320\260_\320\270_\321\203\321\201\321\202\320\260\320\275\320\276\320\262\320\272\320\260/index.html" "b/files/ru/orphaned/\321\201\320\261\320\276\321\200\320\272\320\260_\320\270_\321\203\321\201\321\202\320\260\320\275\320\276\320\262\320\272\320\260/index.html" index d513d5dbad..fe7486f500 100644 --- "a/files/ru/orphaned/\321\201\320\261\320\276\321\200\320\272\320\260_\320\270_\321\203\321\201\321\202\320\260\320\275\320\276\320\262\320\272\320\260/index.html" +++ "b/files/ru/orphaned/\321\201\320\261\320\276\321\200\320\272\320\260_\320\270_\321\203\321\201\321\202\320\260\320\275\320\276\320\262\320\272\320\260/index.html" @@ -5,15 +5,15 @@ original_slug: Сборка_и_установка ---
      Важно: Не начинайте сборку без предварительной конфигурации!

      Сборка

      -

      Для сборки продуктов Mozilla Вам потребуется программный пакет GNU make. Никакой другой компилятор типа "make" не подходит для решения задачи компиляции продуктов Mozilla. На операционных системах Windows, MacOS X и GNU/Linux используйте "make" для запуска компилятора GNU make, на других non-GNU UNIX-подобных используйте "gmake".

      -

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

      -

      Для того, чтобы приступить к компиляции, на ОС Windows, MacOS X или GNU/Linux, убедитесь, что Вы находитесь в самой верхней директории исходного кода Mozilla, после чего выполните команду:

      +

      Для сборки продуктов Mozilla вам потребуется программный пакет GNU make. Никакой другой компилятор типа "make" не подходит для решения задачи компиляции продуктов Mozilla. На операционных системах Windows, MacOS X и GNU/Linux используйте "make" для запуска компилятора GNU make, на других non-GNU UNIX-подобных используйте "gmake".

      +

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

      +

      Для того, чтобы приступить к компиляции, на ОС Windows, MacOS X или GNU/Linux, убедитесь, что вы находитесь в самой верхней директории исходного кода Mozilla, после чего выполните команду:

      make -f client.mk build
      Важно: в MacOS X, путь к директории с исходным кодом Mozilla, не должен содержать пробелов в именах папок!

      Для запуска компиляции на большинстве non-GNU UNIX-подобных операционных системах, выполните команду:

      gmake -f client.mk build
       
      -

      Если Вы хотите собрать программу не в автоматическом режиме, а вручную, то перейдите в Вашу объектную директорию и выполните последовательно команды:

      +

      Если вы хотите собрать программу не в автоматическом режиме, а вручную, то перейдите в Вашу объектную директорию и выполните последовательно команды:

      ./configure
       
       make #для Windows, MacOS X или Linux
      @@ -21,7 +21,7 @@ make #для Windows, MacOS X или Linux
       gmake #для non-GNU UNIX-подобных ОС
       

      Запуск новой сборки

      -

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

      +

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

      @OBJDIR@/dist/bin #
       

      И запустите на выполнение:

      diff --git "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html" "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html" index f1af432fe0..05155b96e9 100644 --- "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html" +++ "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270/index.html" @@ -15,9 +15,9 @@ original_slug: Создание_расширения/Настройка_Firefox_
    1. Откройте терминал.
    2. Введите "firefox -p".
    -

    В открывшемся окне менеджера профилей нажмите кнопку "Создать". Далее следуйте инструкциям в менеджере. Он Вам предложит ввести для нового профиля название, для нашего пусть будет "Develop" (это уже на Ваше усмотрение), а так же предложит выбрать папку, где будет наш профиль храниться. Для папки экспериментального профиля подойдёт открытое и, главное, доступное место, потому что может потребоваться в нем что-нибудь изменить руками или добавить какой-нибудь файл.

    +

    В открывшемся окне менеджера профилей нажмите кнопку "Создать". Далее следуйте инструкциям в менеджере. Он вам предложит ввести для нового профиля название, для нашего пусть будет "Develop" (это уже на ваше усмотрение), а так же предложит выбрать папку, где будет наш профиль храниться. Для папки экспериментального профиля подойдёт открытое и, главное, доступное место, потому что может потребоваться в нем что-нибудь изменить руками или добавить какой-нибудь файл.

    После того, как профиль создан, нажимаем на "Запуск Firefox". После запуска браузера вводим в адресную строку "about:config" и нажимаем Enter. На это браузер нам выдаст окно с предупреждением о возможности испортить программу, мы пообещаем ему быть осторожными.

    -

    В открывшемся меню Вы увидите множество строк с настройками браузера. Но в настройках "по умолчанию" вписаны не все нужные нам строки - ведь в повседневной жизни они не нужны. Для полноценной настройки экспериментального профиля Firefox следует добавить в настройки некоторые параметры. Для этого достаточно нажать правую кнопку мыши в любом месте списка и выбрать из контекстного меню пункт "Создать" --> "Логичкеское".

    +

    В открывшемся меню вы увидите множество строк с настройками браузера. Но в настройках "по умолчанию" вписаны не все нужные нам строки - ведь в повседневной жизни они не нужны. Для полноценной настройки экспериментального профиля Firefox следует добавить в настройки некоторые параметры. Для этого достаточно нажать правую кнопку мыши в любом месте списка и выбрать из контекстного меню пункт "Создать" --> "Логичкеское".

    • javascript.options.showInConsole = true - запись ошибок в файлах chrome в консоль ошибок (англ.).
    • nglayout.debug.disable_xul_cache = true - выключение кеширования xul-объектов. При внесении изменений в окна и диалоги не потребуется перезапуск браузера. Однако, работает только при использовании простых папок, а не jar-архивов. Внесение же изменений в xul-оверлеи все таки потребует перезапуска браузера.
    • browser.dom.window.dump.enabled = true - позволяет выводить в стандартную консоль состояние дампа. Для получения информации смотри window.dump (англ.)
    • javascript.options.strict = true - принудительный вывод в консоль всех предупреждений JavaScript.
    • extensions.logging.enabled = true - вывод информации об инсталляции и обновлении в консоль ошибок.

    Расширения разработчика

    diff --git "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html" "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html" index 7269a58d65..d3ea9e3902 100644 --- "a/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html" +++ "b/files/ru/orphaned/\321\201\320\276\320\267\320\264\320\260\320\275\320\270\320\265_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\321\217/\320\275\320\260\321\201\321\202\321\200\320\276\320\271\320\272\320\260_firefox_\320\264\320\273\321\217_\321\200\320\260\320\267\321\200\320\260\320\261\320\276\321\202\320\272\320\270_\321\200\320\260\321\201\321\210\320\270\321\200\320\265\320\275\320\270\320\271/index.html" @@ -6,7 +6,7 @@ original_slug: Создание_расширения/Настройка_Firefox_

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

    Создание экспериментального профиля Firefox

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

    -

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

    +

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

    Для создания профиля в Microsoft Windows сделайте следующее:

    • Закройте все окна Firefox
    • Нажмите кнопку "Пуск"
    • Выберите меню "Выполнить"
    • Впишите в строку  "Путь_к_папке\с_программой\firefox.exe -no-remote -P имя_профиля"
    diff --git "a/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html" "b/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html" index 2a17f1d4ce..dbf30ffcbd 100644 --- "a/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html" +++ "b/files/ru/orphaned/\321\201\320\277\321\200\320\260\320\262\320\276\321\207\320\275\320\260\321\217_\320\270\320\275\321\204\320\276\321\200\320\274\320\260\321\206\320\270\321\217_\320\277\320\276_gecko_dom/\320\262\320\262\320\265\320\264\320\265\320\275\320\270\320\265/index.html" @@ -46,7 +46,7 @@ p_list = doc.getElementsByTagName("para");

    Вам не нужно делать что-то особенное, чтобы начать использовать DOM. Различные браузеры имеют различные реализации DOM, и эти реализации демонстрируют различную степень соответствия действующему стандарту DOM (тема, которую мы пытаемся избежать в этой документации), но каждый веб-браузер использует некоторую объектную модель документа, чтобы сделать веб-страницы доступными для скрипта.

    -

    Когда вы создаёте код, независимо от того, встроен ли он в элемент <script> или включён в веб-страницу с помощью инструкции по загрузке скрипта извне, вы можете сразу начать использовать API для элементов document или window  для манипулирования самим документом или получить его дочерние элементы, которые являются различными элементами веб-страницы. Ваше программирование DOM может быть достаточно простым, как, например, следующий код, который выводит предупреждающее сообщение используя функцию alert() из объекта window, или может использовать более сложные методы DOM для создания нового контента, как в более длинном примере ниже.

    +

    Когда вы создаёте код, независимо от того, встроен ли он в элемент <script> или включён в веб-страницу с помощью инструкции по загрузке скрипта извне, вы можете сразу начать использовать API для элементов document или window  для манипулирования самим документом или получить его дочерние элементы, которые являются различными элементами веб-страницы. ваше программирование DOM может быть достаточно простым, как, например, следующий код, который выводит предупреждающее сообщение используя функцию alert() из объекта window, или может использовать более сложные методы DOM для создания нового контента, как в более длинном примере ниже.

    Следующий пример кода JavaScript буде выводить предупреждение, когда загрузка документа завершена (и когда весь DOM доступен для использования).

    diff --git a/files/ru/tools/index.html b/files/ru/tools/index.html index 2310ea29f7..056efeb19c 100644 --- a/files/ru/tools/index.html +++ b/files/ru/tools/index.html @@ -25,7 +25,7 @@ translation_of: Tools

    Вы можете открыть Средства Разработчика Firefox (Firefox Developer Tools) с помощью меню, выбрав Открыть меню > Веб-разработка > Инструменты разработчика или используя комбинации клавиш Ctrl + Shift + I или F12 на Windows и Linux, или  Cmd + Opt + I на macOS.

    -

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

    +

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

    @@ -33,7 +33,7 @@ translation_of: Tools - Эта кнопка доступна только в случае, если на странице присутствует несколько фреймов (тегов iframe). Нажатие на эту кнопку отображает список фреймов (тегов iframe) на текущей странице и позволяет выбрать тот фрейм (тег iframe) с которым Вы хотите работать. + Эта кнопка доступна только в случае, если на странице присутствует несколько фреймов (тегов iframe). Нажатие на эту кнопку отображает список фреймов (тегов iframe) на текущей странице и позволяет выбрать тот фрейм (тег iframe) с которым вы хотите работать. diff --git a/files/ru/tools/page_inspector/how_to/examine_and_edit_html/index.html b/files/ru/tools/page_inspector/how_to/examine_and_edit_html/index.html index e8bc647978..63f99bf657 100644 --- a/files/ru/tools/page_inspector/how_to/examine_and_edit_html/index.html +++ b/files/ru/tools/page_inspector/how_to/examine_and_edit_html/index.html @@ -162,7 +162,7 @@ translation_of: Tools/Page_Inspector/How_to/Examine_and_edit_HTML

    Редактирование HTML

    -

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

    +

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

    Чтобы редактировать outerHTML элемента, откройте контекстное меню элемента и выберите «Править как HTML». Вы увидите в панели HTML поле для редактирования текста:

    diff --git a/files/ru/tools/page_inspector/how_to/select_an_element/index.html b/files/ru/tools/page_inspector/how_to/select_an_element/index.html index 2ab45372d8..e5c8685335 100644 --- a/files/ru/tools/page_inspector/how_to/select_an_element/index.html +++ b/files/ru/tools/page_inspector/how_to/select_an_element/index.html @@ -10,7 +10,7 @@ original_slug: Tools/Page_Inspector/How_to/Vybor_elementa ---
    {{ToolsSidebar}}

    {{EmbedYouTube("y2LcsxE2pR0")}}

    -

    Если Вы открыли Инспектор нажатием на «Исследовать элемент», элемент уже будет выбран.

    +

    Если вы открыли Инспектор нажатием на «Исследовать элемент», элемент уже будет выбран.

    В противном случае, когда вы будете перемещать мышь по странице, элемент под курсором мыши будет подсвечиваться, а подсказка будет содержать его HTML-тег, атрибуты class и/или ID, а также размер.  Одновременно в левой панели Инспектора появится HTML-код элемента в его контексте:

    diff --git a/files/ru/tools/performance/index.html b/files/ru/tools/performance/index.html index 5e443d707e..d34b1a9508 100644 --- a/files/ru/tools/performance/index.html +++ b/files/ru/tools/performance/index.html @@ -4,7 +4,7 @@ slug: Tools/Performance translation_of: Tools/Performance original_slug: Tools/Производительность --- -
    {{ToolsSidebar}}

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

    +
    {{ToolsSidebar}}

    Инструмент даёт вам понять общую отзывчивость вашего сайта,  JavaScript и общее представление о разметке. С помощью инструмента производительности вы создадите запись или профиль своего сайта за определённый промежуток времени. Затем, инструмент покажет вам действия браузера и график смены частоты кадров, поверх профиля, рендера вашего сайта.

    Вы получите четыре набора инструментов для более подробного изучения аспектов профиля:

    @@ -45,16 +45,16 @@ original_slug: Tools/Производительность
    Frame rate (Частота кадров)
    -
    Исследование Вашего сайта на отзывчивость.
    +
    Исследование вашего сайта на отзывчивость.
    Call Tree (Дерево вызовов)
    -
    Поиск узких мест Вашего сайта на JavaScript.
    +
    Поиск узких мест вашего сайта на JavaScript.
    Waterfall (Водопад)
    -
    Исследует работу браузера на взаимодействие пользователей с Вашим сайтом.
    +
    Исследует работу браузера на взаимодействие пользователей с вашим сайтом.
    Flame Chart (Диаграмма)
    Обзор выполнения функций JavaScript во времени.
    Allocations (Распределение)
    diff --git a/files/ru/tools/shader_editor/index.html b/files/ru/tools/shader_editor/index.html index fce013a794..b572b37711 100644 --- a/files/ru/tools/shader_editor/index.html +++ b/files/ru/tools/shader_editor/index.html @@ -11,9 +11,9 @@ translation_of: Tools/Shader_Editor

    Для создания шейдеров применяется Шейдерный Язык OpenGL или же GLSL. Можно по-разному внедрять шейдеры на страницу для работы с WebGL: например, их можно "прохардкодить" в JavaScript-исходниках, или подключить в виде отдельных файлов, используя тег <script>, или же подгрузить с сервера в виде простого текста. Исполняемый JavaScript-код отправляет шейдерную программу через программный интерфейс в WebGL, где она компилируется и выполняется с помощью графического ускорителя.

    -

    С помощью Редактора шейдеров Вы можете изучать и редактировать исходники вершинных и фрагментных шейдеров.

    +

    С помощью Редактора шейдеров вы можете изучать и редактировать исходники вершинных и фрагментных шейдеров.

    -

    Вот ещё одна демонстрация того, как Вы можете применять Редактор шейдеров при разработке сложных приложений (в данном случае пример создан на движке Unreal Engine):

    +

    Вот ещё одна демонстрация того, как вы можете применять Редактор шейдеров при разработке сложных приложений (в данном случае пример создан на движке Unreal Engine):

    {{EmbedYouTube("YBErisxQkPQ")}}

    @@ -21,31 +21,31 @@ translation_of: Tools/Shader_Editor

    По умолчанию Редактор шейдеров отключён. Чтобы активировать его, откройте Настройки инструментов разработчика и поставьте галочку на пункте  "Шейдеры" в разделе "Инструменты разработчика по умолчанию". Вы можете заметить, что в панели инструментов появился элемент "Шейдеры". Нажмите на нём для запуска Редактора шейдеров.

    -

    Сначала Вы увидите пустое окно с кнопкой, предлагающей обновить страницу:

    +

    Сначала вы увидите пустое окно с кнопкой, предлагающей обновить страницу:

    Для начала откройте страницу, которая создаёт контекст WebGL и загружает в него программу. Приведённые ниже скриншоты взяты из демонстрации Unreal Engine.

    -

    Перед Вами появится рабочее окно, разделённое на три части: список шейдерных программ GLSL (слева), вершинный шейдер текущей выбранной программы (по центру), а также фрагментный шейдер текущей выбранной программы (справа):

    +

    Перед вами появится рабочее окно, разделённое на три части: список шейдерных программ GLSL (слева), вершинный шейдер текущей выбранной программы (по центру), а также фрагментный шейдер текущей выбранной программы (справа):

    Управление программами

    -

    Левая часть представляет список текущих шейдерных программ, используемых контекстом WebGL. При наведении курсора мыши на элемент списка, представляющий шейдерную программу, Вы увидите, что геометрические объекты, обрабатываемые данной программой, подсвечены красным цветом:

    +

    Левая часть представляет список текущих шейдерных программ, используемых контекстом WebGL. При наведении курсора мыши на элемент списка, представляющий шейдерную программу, вы увидите, что геометрические объекты, обрабатываемые данной программой, подсвечены красным цветом:

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

    -

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

    +

    При нажатии на элемент списка, представляющий шейдерную программу, откроются исходники вершинного и фрагментного шейдеров, составляющих её, и вы сможете их редактировать.

    Редактирование шейдеров

    Средняя и правая часть рабочего окна представляют вершинный и фрагментный шейдеры выбранной шейдерной программы.

    -

    Вы можете отредактировать эти программы и просмотреть результат при следующей отрисовке контекста WebGL (например, при следующем кадре анимации). Например, Вы можете изменить цвета:

    +

    Вы можете отредактировать эти программы и просмотреть результат при следующей отрисовке контекста WebGL (например, при следующем кадре анимации). Например, вы можете изменить цвета:

    -

    Редактор подсвечивает синтаксические ошибки в Вашем коде:

    +

    Редактор подсвечивает синтаксические ошибки в вашем коде:

    Вы увидите дополнительную информацию о проблеме, если наведёте курсор на крестик в левой части строки с ошибкой:

    diff --git a/files/ru/tools/style_editor/index.html b/files/ru/tools/style_editor/index.html index 3fade8632c..870bdbbabc 100644 --- a/files/ru/tools/style_editor/index.html +++ b/files/ru/tools/style_editor/index.html @@ -45,7 +45,7 @@ translation_of: Tools/Style_Editor

    Панель редактора

    -

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

    +

    Справа находится панель редактора. Где вы можете видеть и редактировать исходный код выбранного листа стилей. Любые изменения, которые вы делаете, немедленно применяются к странице. Это позволяет легко экспериментировать, просматривать, а также изменять тестировать. После того как вы удовлетворены вашими изменениями, вы можете сохранить копию локально, нажав кнопку Сохранить в нижнем правом углу листа в панели таблица стилей.

    Редактор предоставляет номера строк и подсветку синтаксиса, что обличает читать вам CSS. Он также поддерживает номер ряда keyboard shortcuts.

    diff --git a/files/ru/tools/tools_toolbox/index.html b/files/ru/tools/tools_toolbox/index.html index 70f95a20b8..7ddbd38192 100644 --- a/files/ru/tools/tools_toolbox/index.html +++ b/files/ru/tools/tools_toolbox/index.html @@ -15,7 +15,7 @@ translation_of: Tools/Tools_Toolbox

    Режим Прикрепления

    -

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

    +

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

     

    @@ -29,7 +29,7 @@ translation_of: Tools/Tools_Toolbox

    Инструмент для выбора объекта

    -

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

    +

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

    Основной набор инструментов

    @@ -159,7 +159,7 @@ translation_of: Tools/Tools_Toolbox

    Расширенные настройки

      -
    • Отключить кеш: позволяет отключить кеш браузера, чтобы определить скорость загрузки всех данных из сети. Начиная с Firefox 33 и новее эта настройка сохраняемая. Это означает, что если Вы отключите кеш, закроете инструменты разработчика и откроете снова, то обнаружите, что кеш все ещё отключён. Тем не менее кеширование автоматически будет включено когда инструменты разработчика закрыты.
    • +
    • Отключить кеш: позволяет отключить кеш браузера, чтобы определить скорость загрузки всех данных из сети. Начиная с Firefox 33 и новее эта настройка сохраняемая. Это означает, что если вы отключите кеш, закроете инструменты разработчика и откроете снова, то обнаружите, что кеш все ещё отключён. Тем не менее кеширование автоматически будет включено когда инструменты разработчика закрыты.
    • Отключить JavaScript: позволяет выключить JavaScript (требуется перезагрузить страницу)
    • Enable Service Workers over HTTP: enable Service Worker registrations from insecure websites
    • Включить отладку chrome и дополнений: позволяет инструментам разработчика получить доступ к контексту самого браузера, а не только веб контента
    • diff --git a/files/ru/tools/web_console/index.html b/files/ru/tools/web_console/index.html index 42e82801e8..33fa903170 100644 --- a/files/ru/tools/web_console/index.html +++ b/files/ru/tools/web_console/index.html @@ -29,7 +29,7 @@ translation_of: Tools/Web_Console

      Как открыть Веб Консоль

      -

      Чтобы открыть Веб-консоль, выберите «Веб-консоль» в меню (Веб-)разработка в Меню Firefox (или меню Инструменты, если Вы настроили показывать панель меню или Вы работаете на Mac OS X), или нажмите её комбинацию клавиш CtrlShiftK (CommandOptionK в OS X).

      +

      Чтобы открыть Веб-консоль, выберите «Веб-консоль» в меню (Веб-)разработка в Меню Firefox (или меню Инструменты, если вы настроили показывать панель меню или вы работаете на Mac OS X), или нажмите её комбинацию клавиш CtrlShiftK (CommandOptionK в OS X).

      Внизу окна браузера появится Набор инструментов с выбранной Веб-консолью (в Панели инструментов разработчика она называется просто «Консоль»):

      @@ -517,7 +517,7 @@ console.trace();

      Очистка содержимого

      -

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

      +

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

      @@ -546,9 +546,9 @@ console.trace();

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

      -

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

      +

      Нажмите Enter или Tab, чтобы принять нужную подсказку, перемещайтесь вверх/вниз с помощью стрелок к другим вариантам подсказок или просто продолжайте набирать текст, если вам не подходит ни один из вариантов.

      -

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

      +

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

      Вы можете получать такие же подсказки для элементов массива:

      @@ -568,7 +568,7 @@ console.trace();

      Работа с iframes

      -

      Если страница содержит встроенные iframes, Вы можете использовать команду cd() чтобы изменить область видимости в консоли на область определённого iframe, и после этого Вы сможете выполнять функции, которые содержит объект document в этом iframe. Существует три способа выбрать iframe используя cd():

      +

      Если страница содержит встроенные iframes, вы можете использовать команду cd() чтобы изменить область видимости в консоли на область определённого iframe, и после этого вы сможете выполнять функции, которые содержит объект document в этом iframe. Существует три способа выбрать iframe используя cd():

      Вы можете передать DOM-элемент для определённого iframe :

      @@ -621,7 +621,7 @@ cd(frame.contentWindow);
      cd("#frame1");
      -

      Сейчас Вы сможете видеть, что глобальный объект Window это теперь наш iframe:

      +

      Сейчас вы сможете видеть, что глобальный объект Window это теперь наш iframe:

      и сможете выполнить вызов функции, определённой в этом iframe:

      diff --git a/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html b/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html index 4c7755c6a1..8a7a122fa9 100644 --- a/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html +++ b/files/ru/web/accessibility/keyboard-navigable_javascript_widgets/index.html @@ -136,7 +136,7 @@ translation_of: Web/Accessibility/Keyboard-navigable_JavaScript_widgets
    • изменить tabindex предыдущего элемента на -1
    • -

      По ссылке Вы можете увидеть пример WAI-ARIA tree view, использующий эту технику.

      +

      По ссылке вы можете увидеть пример WAI-ARIA tree view, использующий эту технику.

      Советы
      diff --git a/files/ru/web/api/attr/index.html b/files/ru/web/api/attr/index.html index 998cd4d512..5c36ec8b69 100644 --- a/files/ru/web/api/attr/index.html +++ b/files/ru/web/api/attr/index.html @@ -27,7 +27,7 @@ translation_of: Web/API/Attr

      Элемент, содержащий атрибут.

      -

      Примечание: DOM уровень 4 удалил это свойство.Предполагалось, что, поскольку Вы получаете объект Attr от {{domxref("Element")}}, вы заранее должны знать связанный элемент.  Поскольку это не верно в случаях, подобных объектам Attr, возвращаемым  {{domxref("Document.evaluate")}}, DOM уровень жизни вновь ввёл это свойство. 

      +

      Примечание: DOM уровень 4 удалил это свойство.Предполагалось, что, поскольку вы получаете объект Attr от {{domxref("Element")}}, вы заранее должны знать связанный элемент.  Поскольку это не верно в случаях, подобных объектам Attr, возвращаемым  {{domxref("Document.evaluate")}}, DOM уровень жизни вновь ввёл это свойство. 

      Gecko выводит предупреждение об использовании, начиная с Gecko 7.0 {{geckoRelease("7.0")}}. Это предупреждение было удалено в Gecko 49.0 (Firefox 49.0 / Thunderbird 49.0 / SeaMonkey 2.46).

      diff --git a/files/ru/web/api/audiocontext/createmediaelementsource/index.html b/files/ru/web/api/audiocontext/createmediaelementsource/index.html index 6693ef14dc..c0576ddc63 100644 --- a/files/ru/web/api/audiocontext/createmediaelementsource/index.html +++ b/files/ru/web/api/audiocontext/createmediaelementsource/index.html @@ -20,7 +20,7 @@ var source = audioCtx.createMediaElementSource(myMediaElement);
      myMediaElement
      -
      Объект {{domxref("HTMLMediaElement")}}, который Вы хотите использовать в качестве исходного звука.
      +
      Объект {{domxref("HTMLMediaElement")}}, который вы хотите использовать в качестве исходного звука.

      Возвращаемые значения

      @@ -29,10 +29,10 @@ var source = audioCtx.createMediaElementSource(myMediaElement);

      Пример

      -

      Простой пример создания аудио узла из элемента {{htmlelement("audio") }} используя createMediaElementSource(), и управления усилением звука через {{ domxref("GainNode") }} перед подачей в {{ domxref("AudioDestinationNode") }} для воспроизведения. При движении мыши вызывается функция updatePage(), вычисляющая текущее усиление как отношение Y позиции курсора к общей высоте окна. Таким образом Вы можете увеличивать/уменьшать громкость звучания аудио движениями мыши вверх/вниз.

      +

      Простой пример создания аудио узла из элемента {{htmlelement("audio") }} используя createMediaElementSource(), и управления усилением звука через {{ domxref("GainNode") }} перед подачей в {{ domxref("AudioDestinationNode") }} для воспроизведения. При движении мыши вызывается функция updatePage(), вычисляющая текущее усиление как отношение Y позиции курсора к общей высоте окна. Таким образом вы можете увеличивать/уменьшать громкость звучания аудио движениями мыши вверх/вниз.

      -

      Примечание: Вы можете также посмотреть демонстрацию или исходники.

      +

      Примечание: вы можете также посмотреть демонстрацию или исходники.

      var audioCtx = new (window.AudioContext || window.webkitAudioContext)();
      diff --git a/files/ru/web/api/beforeunloadevent/index.html b/files/ru/web/api/beforeunloadevent/index.html
      index 768e7d2787..8fd6591080 100644
      --- a/files/ru/web/api/beforeunloadevent/index.html
      +++ b/files/ru/web/api/beforeunloadevent/index.html
      @@ -56,7 +56,7 @@ window.addEventListener("beforeunload", function( event ) {
       

      Совместимость браузеров

      -

      Значение переменной this внутри modifyText() при вызове событием клика будет равно ссылке на глобальный (window) объект (или undefined при использовании strict mode)

      -
      Note: В JavaScript 1.8.5 введён метод Function.prototype.bind() , который позволяет указать значение, которое должно быть использовано для всех вызовов данной функции. Он позволяет вам легко обходить ситуации, в которых не ясно, чему будет равно this, в зависимости от того, в каком контексте будет вызвана ваша функция. заметьте, также, что Вам будет необходимо иметь внешнюю ссылку на обработчик, чтобы Вы могли удалить его позже.
      +
      Note: В JavaScript 1.8.5 введён метод Function.prototype.bind() , который позволяет указать значение, которое должно быть использовано для всех вызовов данной функции. Он позволяет вам легко обходить ситуации, в которых не ясно, чему будет равно this, в зависимости от того, в каком контексте будет вызвана ваша функция. заметьте, также, что вам будет необходимо иметь внешнюю ссылку на обработчик, чтобы вы могли удалить его позже.

      Пример с использованием bind и без него:

      @@ -256,7 +256,7 @@ el.addEventListener("click", () => { modifyText("four"); }, false); } -

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

      +

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

      var Something = function(element) {
         this.name = 'Something Good';
      @@ -297,7 +297,7 @@ el.addEventListener("click", () => { modifyText("four"); }, false);

      Совместимость

      -

      Вы можете обойти методы addEventListener, removeEventListener, Event.preventDefault и Event.stopPropagation не поддерживаемы в IE 8 используя следующий код в начале Вашего скрипта. Этот код поддерживает использование handleEvent и события DOMContentLoaded.

      +

      Вы можете обойти методы addEventListener, removeEventListener, Event.preventDefault и Event.stopPropagation не поддерживаемы в IE 8 используя следующий код в начале вашего скрипта. Этот код поддерживает использование handleEvent и события DOMContentLoaded.

      Note: useCapture не поддерживается, так как IE 8 не имеет альтернативного метода для этого. Также заметьте, что следующий код только добавляет поддержку IE 8. Также, он работает только при соблюдении стандартов: объявление DOCTYPE страницы обязательно.

      diff --git a/files/ru/web/api/eventtarget/eventtarget/index.html b/files/ru/web/api/eventtarget/eventtarget/index.html index d14742cf32..1763d30980 100644 --- a/files/ru/web/api/eventtarget/eventtarget/index.html +++ b/files/ru/web/api/eventtarget/eventtarget/index.html @@ -62,7 +62,7 @@ let newValue = myEventTarget.secret; // == 7

      Совместимость браузеров

      - +

      {{Compat("api.EventTarget.EventTarget")}}

      diff --git a/files/ru/web/api/fetch_api/using_fetch/index.html b/files/ru/web/api/fetch_api/using_fetch/index.html index 2302fa8568..f64391a1bf 100644 --- a/files/ru/web/api/fetch_api/using_fetch/index.html +++ b/files/ru/web/api/fetch_api/using_fetch/index.html @@ -311,7 +311,7 @@ console.log(myHeaders.get("X-Custom-Header")); // [ ]
    -

    Примечание: Вы не можете добавить или установить request защищаемые Headers’ заголовок Content-Length. Аналогично, вставка Set-Cookie в заголовок ответа недопустимо: ServiceWorkers не допускают установки cookies через синтезированные ответы.

    +

    Примечание: вы не можете добавить или установить request защищаемые Headers’ заголовок Content-Length. Аналогично, вставка Set-Cookie в заголовок ответа недопустимо: ServiceWorkers не допускают установки cookies через синтезированные ответы.

    Объекты ответа

    diff --git a/files/ru/web/api/gamepadevent/gamepad/index.html b/files/ru/web/api/gamepadevent/gamepad/index.html index 903e5e0916..b44acec436 100644 --- a/files/ru/web/api/gamepadevent/gamepad/index.html +++ b/files/ru/web/api/gamepadevent/gamepad/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/GamepadEvent/gamepad

    Свойство GamepadEvent.gamepad, интерфейса {{domxref("GamepadEvent")}}, возвращает объект {{domxref("Gamepad")}}, предоставляющий доступ к данным геймпада для событий gamepadconnected и gamepaddisconnected.

    -

    Примечание: Эти события не возникают Chrome, только в Firefox. В Chrome Вы должны использовать {{domxref("Navigator.getGamepads")}} для доступа к объекту {{domxref("Gamepad")}}.

    +

    Примечание: Эти события не возникают Chrome, только в Firefox. В Chrome вы должны использовать {{domxref("Navigator.getGamepads")}} для доступа к объекту {{domxref("Gamepad")}}.

    Синтаксис

    diff --git a/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html b/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html index 58ee18af30..57276f7862 100644 --- a/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html +++ b/files/ru/web/api/geolocation_api/using_the_geolocation_api/index.html @@ -44,7 +44,7 @@ original_slug: Web/API/Geolocation/Using_geolocation/Using_the_Geolocation_API

    Если данные о местоположении меняются (либо устройство находится в движении, либо пришли более точные данные о геопозиции), вы можете указать callback функцию, которая будет вызывается при любом обновлении данных о местоположении. Это делается с использованием функции {{domxref("Geolocation.watchPosition()","watchPosition()")}}, которая имеет несколько входных параметров: {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}. Эта функция вызывается много раз, позволяя браузеру обновлять данные о текущей локации либо во время движения, либо после получения более точной информации о местоположении (после применения более точных приёмов). Функция, которая вызывается при ошибке, для {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}, при желании, может быть вызвана неоднократно.

    -

    Примечание: Вы можете использовать {{domxref("Geolocation.watchPosition()","watchPosition()")}} без вызова {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.

    +

    Примечание: вы можете использовать {{domxref("Geolocation.watchPosition()","watchPosition()")}} без вызова {{domxref("Geolocation.getCurrentPosition()","getCurrentPosition()")}}.

    var watchID = navigator.geolocation.watchPosition(function(position) {
    diff --git a/files/ru/web/api/globaleventhandlers/onclick/index.html b/files/ru/web/api/globaleventhandlers/onclick/index.html
    index 806b0270c2..47724b1f9d 100644
    --- a/files/ru/web/api/globaleventhandlers/onclick/index.html
    +++ b/files/ru/web/api/globaleventhandlers/onclick/index.html
    @@ -54,7 +54,7 @@ translation_of: Web/API/GlobalEventHandlers/onclick
     </html>
     
    -

    Или же Вы можете использовать анонимную функцию, как здесь:

    +

    Или же вы можете использовать анонимную функцию, как здесь:

    p.onclick = function(event) { alert("moot!"); };
     
    @@ -63,7 +63,7 @@ translation_of: Web/API/GlobalEventHandlers/onclick

    Событие click возникает, когда пользователь кликает на элемент. Событие click возникнет после событий mousedown и mouseup.

    -

    С данным свойством только один обработчик события click может быть назначен объекту. Возможно, вместо данного метода, Вам стоит обратить внимание на метод {{domxref("EventTarget.addEventListener()")}}, т.к. он более гибкий и является частью спецификации DOM Events.

    +

    С данным свойством только один обработчик события click может быть назначен объекту. Возможно, вместо данного метода, вам стоит обратить внимание на метод {{domxref("EventTarget.addEventListener()")}}, т.к. он более гибкий и является частью спецификации DOM Events.

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

    diff --git a/files/ru/web/api/history/index.html b/files/ru/web/api/history/index.html index 404fc1eb5c..cb591aa349 100644 --- a/files/ru/web/api/history/index.html +++ b/files/ru/web/api/history/index.html @@ -42,14 +42,14 @@ translation_of: Web/API/History

    Загружает страницу из истории сессии, определяя её положение относительно текущей страницы, например: -1 для предыдущей страницы или 1 для следующей страницы. Когда integerDelta выходит за предел (например, -1, когда нет ранее посещённых страниц в истории сессии), метод не делает ничего, и не вызывает исключение. Вызов Go () без параметров или с не целочисленным аргументом не имеет никакого эффекта (в отличие от Internet Explorer, который поддерживает строки URL в качестве аргумента).

    {{domxref("History.pushState()")}} {{ gecko_minversion_inline("2.0") }}
    -
    Помещает полученные данные в стек истории сессии с определённым заголовком и, при наличии , URL. Данные рассматриваются DOM как непрозрачные; Вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см. управление историей браузера. +
    Помещает полученные данные в стек истории сессии с определённым заголовком и, при наличии , URL. Данные рассматриваются DOM как непрозрачные; вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см. управление историей браузера.
    Примечание: В Gecko 2.0 {{ geckoRelease("2.0") }} до Gecko 5.0 {{ geckoRelease("5.0") }}, передаваемый объект сериарилизовался в JSON. Начиная с Gecko 6.0 {{ geckoRelease("6.0") }}, объект обрабатывается по алгоритму структурированного клонирования. Он позволяет передавать более широкое разнообразие объектов.
    {{domxref("History.replaceState()")}} {{ gecko_minversion_inline("2.0") }}
    -
    Обновляет последнюю запись в стеке истории содержащий определённые данные, заголовок и, при наличии, URL. Данные рассматриваются DOM как непрозрачные; Вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см. управление историей браузера. +
    Обновляет последнюю запись в стеке истории содержащий определённые данные, заголовок и, при наличии, URL. Данные рассматриваются DOM как непрозрачные; вы можете задать любой объект JavaScript, который может быть сериализован. Обратите внимание, что в настоящее время Firefox игнорирует параметр заголовка; для получения дополнительной информации см. управление историей браузера.
    Примечание: В Gecko 2.0 {{ geckoRelease("2.0") }} до Gecko 5.0 {{ geckoRelease("5.0") }}, передаваемый объект сериарилизовался в JSON. Начиная с Gecko 6.0 {{ geckoRelease("6.0") }}, объект обрабатывается по алгоритму структурированного клонирования. Он позволяет передавать более широкое разнообразие объектов.
    diff --git a/files/ru/web/api/htmlaudioelement/audio/index.html b/files/ru/web/api/htmlaudioelement/audio/index.html index df1406bca2..ac1ae1c17d 100644 --- a/files/ru/web/api/htmlaudioelement/audio/index.html +++ b/files/ru/web/api/htmlaudioelement/audio/index.html @@ -74,7 +74,7 @@ original_slug: Web/API/HTMLAudioElement/Audio()

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

    -

    Таблица совместимости на этой странице генерируется из структурированных данных. Если Вы хотите внести свой вклад в эти данные, просмотрите https://github.com/mdn/browser-compat-data и отправьте нам Pull-запрос.

    +

    Таблица совместимости на этой странице генерируется из структурированных данных. Если вы хотите внести свой вклад в эти данные, просмотрите https://github.com/mdn/browser-compat-data и отправьте нам Pull-запрос.

    {{Compat("api.HTMLAudioElement.Audio")}}

    diff --git a/files/ru/web/api/htmldialogelement/open/index.html b/files/ru/web/api/htmldialogelement/open/index.html index 7e27ba5aab..28a6c8f812 100644 --- a/files/ru/web/api/htmldialogelement/open/index.html +++ b/files/ru/web/api/htmldialogelement/open/index.html @@ -86,7 +86,7 @@ var myOpenValue = dialogInstance.open; </script>
    -

    Примечание: Вы можете найти данный пример на htmldialogelement-basic (see it live also).

    +

    Примечание: вы можете найти данный пример на htmldialogelement-basic (see it live also).

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

    diff --git a/files/ru/web/api/htmlmediaelement/abort_event/index.html b/files/ru/web/api/htmlmediaelement/abort_event/index.html index 572d6655e9..c15e34e970 100644 --- a/files/ru/web/api/htmlmediaelement/abort_event/index.html +++ b/files/ru/web/api/htmlmediaelement/abort_event/index.html @@ -66,7 +66,7 @@ video.appendChild(source);

    Совместимость с браузерами

    - +

    {{Compat("api.HTMLMediaElement.abort_event")}}

    diff --git a/files/ru/web/api/indexeddb_api/using_indexeddb/index.html b/files/ru/web/api/indexeddb_api/using_indexeddb/index.html index cc7345e92b..be4dcb0285 100644 --- a/files/ru/web/api/indexeddb_api/using_indexeddb/index.html +++ b/files/ru/web/api/indexeddb_api/using_indexeddb/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/IndexedDB_API/Using_IndexedDB

    Это руководство по использованию асинхронного API для IndexedDB. Если вы не знакомы с IndexedDB, то обратитесь для начала к документу Basic Concepts About IndexedDB. .

    -
    Некоторые части документа не переведены, в основном это повсеместно принятые в программировании рекомендации, такие как обработка ошибок или что-то очевидное. Тем не менее Вы можете/должны продолжить перевод. Главная цель перевода - понять основные концепции IndexedDB, обратить внимание на важные нюансы, прокомментировать исходный код и может быть добавить примеры.
    +
    Некоторые части документа не переведены, в основном это повсеместно принятые в программировании рекомендации, такие как обработка ошибок или что-то очевидное. Тем не менее вы можете/должны продолжить перевод. Главная цель перевода - понять основные концепции IndexedDB, обратить внимание на важные нюансы, прокомментировать исходный код и может быть добавить примеры.

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

    @@ -99,7 +99,7 @@ request.onsuccess = function(event) {
    var db;
     var request = indexedDB.open("MyTestDatabase");
     request.onerror = function(event) {
    -  alert("Почему Вы не позволяете моему веб-приложению использовать IndexedDB?!");
    +  alert("Почему вы не позволяете моему веб-приложению использовать IndexedDB?!");
     };
     request.onsuccess = function(event) {
       db = event.target.result;
    diff --git a/files/ru/web/api/performance/index.html b/files/ru/web/api/performance/index.html
    index 47d7221e51..473fafc0ad 100644
    --- a/files/ru/web/api/performance/index.html
    +++ b/files/ru/web/api/performance/index.html
    @@ -16,7 +16,7 @@ translation_of: Web/API/Performance
     

    Объект этого типа может быть получен в результате вызова атрибута {{domxref("Window.performance")}}, доступного только для чтения.

    -

    Замечание: Этот интерфейс и его составляющие доступны в фоновых потоках выполнения, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса ещё не документированы (подробнее см. разделы документации Performance Timeline и User Timing). Также заметим, что временные метки производительности относятся к текущему контексту. Если Вы создадите метку в основном потоке (или в другом фоновом потоке), то её нельзя будет увидеть в другом фоновом потоке и наоборот.

    +

    Замечание: Этот интерфейс и его составляющие доступны в фоновых потоках выполнения, за исключением случаев, перечисленных ниже. Заметим, что некоторые доступные части интерфейса ещё не документированы (подробнее см. разделы документации Performance Timeline и User Timing). Также заметим, что временные метки производительности относятся к текущему контексту. Если вы создадите метку в основном потоке (или в другом фоновом потоке), то её нельзя будет увидеть в другом фоновом потоке и наоборот.

    Свойства

    diff --git a/files/ru/web/api/pushmanager/subscribe/index.html b/files/ru/web/api/pushmanager/subscribe/index.html index 17926befd3..a970f48612 100644 --- a/files/ru/web/api/pushmanager/subscribe/index.html +++ b/files/ru/web/api/pushmanager/subscribe/index.html @@ -20,7 +20,7 @@ translation_of: Web/API/PushManager/subscribe
    Объект, содержащий необязательные параметры конфигурации. Может иметь следующие свойства:
    • userVisibleOnly: Булевое значение, указывающее на то, будет ли возвращаемая подписка использоваться для сообщений, чей эффект может быть видим для пользователя.
    • -
    • applicationServerKey: открытый ключ ECDSA P-256, закодированный в Base64 {{domxref ('DOMString')}} или {{domxref ('ArrayBuffer')}}}, содержащий , который push-сервер будет использовать для аутентификации сервера приложений. Если указано, все сообщения с сервера Вашего приложения должны использовать схему аутентификации VAPID и включать JWT, подписанный соответствующим закрытым ключом. Этот ключ НЕ тот же ключ ECDH, который вы используете для шифрования данных. Для получения дополнительной информации см. «Using VAPID with WebPush».
    • +
    • applicationServerKey: открытый ключ ECDSA P-256, закодированный в Base64 {{domxref ('DOMString')}} или {{domxref ('ArrayBuffer')}}}, содержащий , который push-сервер будет использовать для аутентификации сервера приложений. Если указано, все сообщения с сервера вашего приложения должны использовать схему аутентификации VAPID и включать JWT, подписанный соответствующим закрытым ключом. Этот ключ НЕ тот же ключ ECDH, который вы используете для шифрования данных. Для получения дополнительной информации см. «Using VAPID with WebPush».
    diff --git a/files/ru/web/api/server-sent_events/using_server-sent_events/index.html b/files/ru/web/api/server-sent_events/using_server-sent_events/index.html index bee580418a..bd35a39e6b 100644 --- a/files/ru/web/api/server-sent_events/using_server-sent_events/index.html +++ b/files/ru/web/api/server-sent_events/using_server-sent_events/index.html @@ -82,7 +82,7 @@ while (1) {

    Приведённый выше код генерирует событие каждую секунду с типом события «ping». Данные каждого события - это объект JSON, содержащий метку времени ISO 8601, соответствующую дате, когда было сгенерировано событие. Через случайные интервалы отправляется простое сообщение (без типа event).

    -

    Примечание: Вы можете найти полный пример, который использует код, показанный в этой статье на GitHub - см. Simple SSE demo using PHP.

    +

    Примечание: вы можете найти полный пример, который использует код, показанный в этой статье на GitHub - см. Simple SSE demo using PHP.

    Обработка ошибок

    diff --git a/files/ru/web/api/service_worker_api/using_service_workers/index.html b/files/ru/web/api/service_worker_api/using_service_workers/index.html index 9712ab58c2..b8dcf3657d 100644 --- a/files/ru/web/api/service_worker_api/using_service_workers/index.html +++ b/files/ru/web/api/service_worker_api/using_service_workers/index.html @@ -131,12 +131,12 @@ imgLoad('myLittleVader.jpg').then((response) => {

    Все это происходит асинхронно.

    -

    На заметку: Вы можете также объединять вызов нескольких промис-методов в одну цепочку, как в этом примере:
    +

    На заметку: вы можете также объединять вызов нескольких промис-методов в одну цепочку, как в этом примере:
    myPromise().then(success, failure).then(success).catch(failure);

    -

    На заметку: Вы можете получить гораздо больше информации о промисах, прочитав превосходную статью Джейка Арчибальда (Jake Archibald’s) JavaScript Promises: there and back again.

    +

    На заметку: вы можете получить гораздо больше информации о промисах, прочитав превосходную статью Джейка Арчибальда (Jake Archibald’s) JavaScript Promises: there and back again.

    Демонстрация Service Workers

    @@ -145,7 +145,7 @@ imgLoad('myLittleVader.jpg').then((response) => {



    - Вы можете посмотреть исходный код на GitHub, а также этот живой пример. Единственное, что мы тут рассмотрим, это промис (смотрите app.js строки 22-47), модифицированная версия того, о котором вы читали выше в разделе Тестовая демонстрация промисов. Разница в следующем:

    +Вы можете посмотреть исходный код на GitHub, а также этот живой пример. Единственное, что мы тут рассмотрим, это промис (смотрите app.js строки 22-47), модифицированная версия того, о котором вы читали выше в разделе Тестовая демонстрация промисов. Разница в следующем:

    1. Ранее мы передавали параметром лишь URL изображения, которое мы хотели загрузить. Теперь же, мы передаём JSON-фрагмент, содержащий все данные для изображения (посмотрите, как это выглядит в image-list.js). Это сделано потому, что все данные для выполнения каждого промиса должны быть переданы ему, так как он выполняется асинхронно. Если же вы передали лишь URL, а чуть позже попытались получить доступ к другим атрибутам в JSON-фрагменте внутри цикла for(), это бы не сработало, так как этот промис не был бы выполнен во время текущей итерации цикла (это синхронный процесс).
    2. @@ -437,7 +437,7 @@ event.request.body
    -

    На заметку: Вы можете держать своё приложение на http://localhost (например, используя me@localhost:/my/app$ python -m SimpleHTTPServer) для локальной разработки. См. Security considerations

    +

    На заметку: вы можете держать своё приложение на http://localhost (например, используя me@localhost:/my/app$ python -m SimpleHTTPServer) для локальной разработки. См. Security considerations

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

    diff --git a/files/ru/web/api/speechrecognition/index.html b/files/ru/web/api/speechrecognition/index.html index f7939e84d2..2d51a58b74 100644 --- a/files/ru/web/api/speechrecognition/index.html +++ b/files/ru/web/api/speechrecognition/index.html @@ -193,7 +193,7 @@ recognition.onresult = function(event) {
      -
    • [1] Интерфейсы распознавания речи в настоящее время префиксные в Chrome, поэтому вам нужно указать имена интерфейсов, например, префикс. WebkitSpeechRecognition; Вы также должны будете обслуживать свой код через веб-сервер для распознавания работы
    • +
    • [1] Интерфейсы распознавания речи в настоящее время префиксные в Chrome, поэтому вам нужно указать имена интерфейсов, например, префикс. WebkitSpeechRecognition; вы также должны будете обслуживать свой код через веб-сервер для распознавания работы
    • [2] Может быть активирована через media.webspeech.recognition.enable флаг в about:config на телефоне. Не реализовано вообще на рабочем столе Firefox - см.{{bug(1248897)}}.
    diff --git a/files/ru/web/api/storage/key/index.html b/files/ru/web/api/storage/key/index.html index ace4277c9b..7792923102 100644 --- a/files/ru/web/api/storage/key/index.html +++ b/files/ru/web/api/storage/key/index.html @@ -39,7 +39,7 @@ translation_of: Web/API/Storage/key }
    -

    Примечание: Реальный пример Вы можете увидеть на Web Storage Demo.

    +

    Примечание: Реальный пример вы можете увидеть на Web Storage Demo.

    Стандарты

    diff --git a/files/ru/web/api/storage_access_api/index.html b/files/ru/web/api/storage_access_api/index.html index b25793e407..b94cbbaff4 100644 --- a/files/ru/web/api/storage_access_api/index.html +++ b/files/ru/web/api/storage_access_api/index.html @@ -78,7 +78,7 @@ translation_of: Web/API/Storage_Access_API

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

    -

    API на стадии обсуждения — стандартизация не начата. Сейчас Вы можете ознакомиться с подробной спецификацией API в блоге Apple Introducing Storage Access API и WHATWG HTML issue 3338 — Proposal: Storage Access API.

    +

    API на стадии обсуждения — стандартизация не начата. Сейчас вы можете ознакомиться с подробной спецификацией API в блоге Apple Introducing Storage Access API и WHATWG HTML issue 3338 — Proposal: Storage Access API.

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

    diff --git a/files/ru/web/api/vrdisplay/requestpresent/index.html b/files/ru/web/api/vrdisplay/requestpresent/index.html index acdb59197f..46af415823 100644 --- a/files/ru/web/api/vrdisplay/requestpresent/index.html +++ b/files/ru/web/api/vrdisplay/requestpresent/index.html @@ -18,7 +18,7 @@ translation_of: Web/API/VRDisplay/requestPresent
    layers
    -
    Массив объектов типа {{domxref("VRLayerInit")}}, представляющих собой сцену, которую Вы хотите отобразить. На данный момент может быть минимум 0 элементов, максимум - 1.
    +
    Массив объектов типа {{domxref("VRLayerInit")}}, представляющих собой сцену, которую вы хотите отобразить. На данный момент может быть минимум 0 элементов, максимум - 1.

    Возвращаемое значение

    diff --git a/files/ru/web/api/web_audio_api/index.html b/files/ru/web/api/web_audio_api/index.html index cb927ca206..40169f5104 100644 --- a/files/ru/web/api/web_audio_api/index.html +++ b/files/ru/web/api/web_audio_api/index.html @@ -39,7 +39,7 @@ translation_of: Web/API/Web_Audio_API на модели source-listener, он позволяет контролировать модель панорамирования и обходиться без дистанционно-вызванного ослабления (distance-induced attenuation) или duppler shift, вызванного сдвигом источника (или сдвигом слушателя).

    -

    Помните: Вы можете прочитать более детальный теоретический материал о Web audio API в нашей статье Basic concepts behind Web Audio API.

    +

    Помните: вы можете прочитать более детальный теоретический материал о Web audio API в нашей статье Basic concepts behind Web Audio API.

    Web Audio API интерфейсы

    diff --git a/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html b/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html index a64b370af2..5e035e4eb5 100644 --- a/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html +++ b/files/ru/web/api/web_audio_api/visualizations_with_web_audio_api/index.html @@ -8,7 +8,7 @@ translation_of: Web/API/Web_Audio_API/Visualizations_with_Web_Audio_API
    -

    Примечание: Вы можете найти рабочие примеры всех фрагментов кода в нашей демонстрации автоизменения голоса.

    +

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

    Основные концепции

    @@ -33,12 +33,12 @@ distortion.connect(audioCtx.destination);

    Затем анализатор захватит аудиоданные, используя быстрое преобразование Фурье (БПФ) в определённой частотной области, в зависимости от того, что вы укажете как значение свойства {{ domxref("AnalyserNode.fftSize") }} (если свойство не задано, то значение по умолчанию равно 2048).

    -

    Примечание: Вы так же можете указать значения минимума и максимума для диапазона масштабирования данных БПФ, используя {{ domxref("AnalyserNode.minDecibels") }} и {{ domxref("AnalyserNode.maxDecibels") }}, и разные константы усреднения данных с помощью {{ domxref("AnalyserNode.smoothingTimeConstant") }}. Прочтите эти страницы, чтобы получить больше информации о том как их использовать.

    +

    Примечание: вы так же можете указать значения минимума и максимума для диапазона масштабирования данных БПФ, используя {{ domxref("AnalyserNode.minDecibels") }} и {{ domxref("AnalyserNode.maxDecibels") }}, и разные константы усреднения данных с помощью {{ domxref("AnalyserNode.smoothingTimeConstant") }}. Прочтите эти страницы, чтобы получить больше информации о том как их использовать.

    -

    Чтобы получить данные, Вам нужно использовать методы {{ domxref("AnalyserNode.getFloatFrequencyData()") }} и {{ domxref("AnalyserNode.getByteFrequencyData()") }}, чтобы получить данные о частоте, и {{ domxref("AnalyserNode.getByteTimeDomainData()") }} и {{ domxref("AnalyserNode.getFloatTimeDomainData()") }} чтобы получить данные о форме волны.

    +

    Чтобы получить данные, вам нужно использовать методы {{ domxref("AnalyserNode.getFloatFrequencyData()") }} и {{ domxref("AnalyserNode.getByteFrequencyData()") }}, чтобы получить данные о частоте, и {{ domxref("AnalyserNode.getByteTimeDomainData()") }} и {{ domxref("AnalyserNode.getFloatTimeDomainData()") }} чтобы получить данные о форме волны.

    -

    Эти методы копируют данные в указанный массив, поэтому Вам необходимо создать новый массив для хранения данных, прежде чем вызывать эти функции . Результат первой из них - числа типа float32, второй и третьей - uint8, поэтому стандартный массив JavaScript не подойдёт для их хранения — следует использовать массивы {{ domxref("Float32Array") }} или {{ domxref("Uint8Array") }}, в зависимости от нужных Вам данных.

    +

    Эти методы копируют данные в указанный массив, поэтому вам необходимо создать новый массив для хранения данных, прежде чем вызывать эти функции . Результат первой из них - числа типа float32, второй и третьей - uint8, поэтому стандартный массив JavaScript не подойдёт для их хранения — следует использовать массивы {{ domxref("Float32Array") }} или {{ domxref("Uint8Array") }}, в зависимости от нужных вам данных.

    Например, если параметр AnalyserNode.fftSize установлен на 2048, мы возвращаем значение {{ domxref("AnalyserNode.frequencyBinCount") }}, равное половине fft, затем вызываем Uint8Array() с frequencyBinCount в качестве длины — столько измерений мы произведём для данного размера fft.

    diff --git a/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html b/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html index 882f40200d..af1eb40004 100644 --- a/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html +++ b/files/ru/web/api/web_storage_api/using_the_web_storage_api/index.html @@ -87,7 +87,7 @@ else {

    Метод {{domxref("Storage.getItem()")}} используется для получения данных из storage; в этом примере мы проверяем, чтобы увидеть существует ли bgcolor; если нет, мы запускаем populateStorage(), чтобы добавить значение по умолчанию в storage. Если значения уже есть там, мы запускаем setStyles(), для обновления стиля страница с сохранёнными значениями.
    - Примечание: Вы можете также использовать {{domxref("Storage.length")}} для проверки storage object.

    + Примечание: вы можете также использовать {{domxref("Storage.length")}} для проверки storage object.

    Получение данных из Storage

    diff --git a/files/ru/web/api/webvr_api/index.html b/files/ru/web/api/webvr_api/index.html index a4809c7504..8905173834 100644 --- a/files/ru/web/api/webvr_api/index.html +++ b/files/ru/web/api/webvr_api/index.html @@ -33,7 +33,7 @@ translation_of: Web/API/WebVR_API

    Кроме того, WebVR 1.1 добавляет ряд событий {{domxref("Window")}} объекту, чтобы JavaScript мог реагировать на изменения состояния дисплея.

    -

    Примечание: Вы можете найти намного больше о том, как работает API в Using the WebVR API и WebVR Concepts статьях.

    +

    Примечание: вы можете найти намного больше о том, как работает API в Using the WebVR API и WebVR Concepts статьях.

    Использование контроллеров: Объединение WebVR с API-интерфейсом геймпада

    diff --git a/files/ru/web/api/webvr_api/using_the_webvr_api/index.html b/files/ru/web/api/webvr_api/using_the_webvr_api/index.html index 1a82614d89..aae1549b03 100644 --- a/files/ru/web/api/webvr_api/using_the_webvr_api/index.html +++ b/files/ru/web/api/webvr_api/using_the_webvr_api/index.html @@ -5,7 +5,7 @@ translation_of: Web/API/WebVR_API/Using_the_WebVR_API ---
    {{APIRef("WebVR API")}}
    -

    WebVR API - фантастическое дополнение к набору инструментов веб-разработчика, позволяющее отображать WebGL сцены на устройствах виртуальной реальности, таких как Oculus Rift и HTC Vive. Но как же начать разработку VR для Веба? Эта статья познакомит Вас с основами.

    +

    WebVR API - фантастическое дополнение к набору инструментов веб-разработчика, позволяющее отображать WebGL сцены на устройствах виртуальной реальности, таких как Oculus Rift и HTC Vive. Но как же начать разработку VR для Веба? Эта статья познакомит вас с основами.

    Обратите внимание: Наиболее стабильная версия WebVR API — 1.1 — была недавно реализована в Firefox 55 (для Windows в релизной версии, для Mac OS X только в Nightly версии). Так же она доступна в Chrome при использовании Google Daydream. Существует спецификация для следующей версии — 2.0 — но процесс разработки всё ещё находится на ранней стадии. Последнюю информацию можно найти на WebVR Spec Version List.

    @@ -13,22 +13,22 @@ translation_of: Web/API/WebVR_API/Using_the_WebVR_API

    С чего начать

    -

    Для начала Вам понадобится:

    +

    Для начала вам понадобится:

    • Устройство с поддержкой VR.
        -
      • Самым дешёвым вариантом будет использовать мобильное устройство, какое-нибудь крепление (например, Google Cardboard) и подходящий браузер. Ощущения будут не такие яркие, как от специализированного устройства, но зато Вам не понадобится приобретать мощный компьютер или отдельный VR дисплей.
      • +
      • Самым дешёвым вариантом будет использовать мобильное устройство, какое-нибудь крепление (например, Google Cardboard) и подходящий браузер. Ощущения будут не такие яркие, как от специализированного устройства, но зато вам не понадобится приобретать мощный компьютер или отдельный VR дисплей.
      • Специализированное устройство может быть дорогим, но зато ощущения будут лучше. Наиболее WebVR-совместимые устройства на данный момент: HTC VIVE, The Oculus Rift. Дополнительную информацию о доступных устройствах и их поддержке браузерами можно найти на webvr.info.
    • -
    • Компьютер с мощностью, достаточной для соответствующего рендеринга/отображения VR сцен, если вы всё-таки решите воспользоваться специализированным устройством. Чтобы получить некоторое представление о системных требованиях, поищите соответствующие руководства для VR платформы, которую Вы думаете использовать. В качестве примера: VIVE READY Computers.
    • +
    • Компьютер с мощностью, достаточной для соответствующего рендеринга/отображения VR сцен, если вы всё-таки решите воспользоваться специализированным устройством. Чтобы получить некоторое представление о системных требованиях, поищите соответствующие руководства для VR платформы, которую вы думаете использовать. В качестве примера: VIVE READY Computers.
    • Подходящий браузер. Последние версии Firefox Nightly и Chrome на данные момент являются лучшими вариантами, как для ПК, так и для мобильных устройств.
    -

    После того, как Вы всё подготовили, можете проверить всё ли работает как следует. Для этого надо открыть простой A-Frame пример и убедиться, что сцена отображается и что можно перейти в VR режим по нажатию на кнопку в правом нижнем углу.

    +

    После того, как вы всё подготовили, можете проверить всё ли работает как следует. Для этого надо открыть простой A-Frame пример и убедиться, что сцена отображается и что можно перейти в VR режим по нажатию на кнопку в правом нижнем углу.

    -

    Фреймворк A-Frame является лучшим вариантом, если Вы хотите быстро создать WebVR-совместимую сцену, не углубляясь в огромное количество JavaScript кода. Однако, пользуясь им, Вы не узнаете о работе с чистым WebVR API, а именно этим мы сейчас и займёмся.

    +

    Фреймворк A-Frame является лучшим вариантом, если вы хотите быстро создать WebVR-совместимую сцену, не углубляясь в огромное количество JavaScript кода. Однако, пользуясь им, вы не узнаете о работе с чистым WebVR API, а именно этим мы сейчас и займёмся.

    Introducing our demo

    @@ -37,13 +37,13 @@ translation_of: Web/API/WebVR_API/Using_the_WebVR_API

    -

    Обратите внимание: Вы можете найти исходный код примера на GitHub, а так же посмотреть как он работает прямо в браузере.

    +

    Обратите внимание: вы можете найти исходный код примера на GitHub, а так же посмотреть как он работает прямо в браузере.

    -

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

    +

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

    -

    Обратите внимание: Если WebVR не работает в Вашем браузере, то возможно Вам следует убедиться, что работа идёт через видеокарту. Например, для видеокарт фирмы NVIDIA, если у Вас успешно установлена панель управления NVIDIA, по клику правой кнопки на ярлык Firefox появится контекстное меню, в котором можно будет выбрать Run with graphics processor > High-performance NVIDIA processor.

    +

    Обратите внимание: Если WebVR не работает в вашем браузере, то возможно вам следует убедиться, что работа идёт через видеокарту. Например, для видеокарт фирмы NVIDIA, если у вас успешно установлена панель управления NVIDIA, по клику правой кнопки на ярлык Firefox появится контекстное меню, в котором можно будет выбрать Run with graphics processor > High-performance NVIDIA processor.

    Наш пример это своеобразный святой Грааль примеров WebGL  — вращающийся куб в 3D. Реализован этот пример с помощью чистого WebGL API. Мы не будем объяснять основы JavaScript или WebGL, а только то, что касается WebVR.

    @@ -55,7 +55,7 @@ translation_of: Web/API/WebVR_API/Using_the_WebVR_API
  • Кнопка, показывающая и скрывающая обновляемые в реальном времени данные о положении и направлении VR устройства.
  • -

    При просмотре исходного кода основного JavaScript файла нашего примера, Вы легко сможете найти части, относящиеся к WebVR, по предваряющим их комментариям. Просто забейте в строку поиска по документу строчку "WebVR".

    +

    При просмотре исходного кода основного JavaScript файла нашего примера, вы легко сможете найти части, относящиеся к WebVR, по предваряющим их комментариям. Просто забейте в строку поиска по документу строчку "WebVR".

    Обратите внимание: Чтобы узнать больше об основах JavaScript и WebGL, обратитесь к нашим учебным материалам по JavaScript и нашему руководству по WebGL.

    diff --git a/files/ru/web/api/webxr_device_api/index.html b/files/ru/web/api/webxr_device_api/index.html index 7a1ce319e1..5db21be1de 100644 --- a/files/ru/web/api/webxr_device_api/index.html +++ b/files/ru/web/api/webxr_device_api/index.html @@ -100,7 +100,7 @@ translation_of: Web/API/WebXR_Device_API

    Руководства и уроки

    -

    Следующие руководства и уроки помогут Вам изучить, как работает WebXR и низкоуровневые функции 3D и VR/AR графики.

    +

    Следующие руководства и уроки помогут вам изучить, как работает WebXR и низкоуровневые функции 3D и VR/AR графики.

    Основы

    diff --git a/files/ru/web/api/window/beforeunload_event/index.html b/files/ru/web/api/window/beforeunload_event/index.html index 8df0192e07..e607468497 100644 --- a/files/ru/web/api/window/beforeunload_event/index.html +++ b/files/ru/web/api/window/beforeunload_event/index.html @@ -85,7 +85,7 @@ translation_of: Web/API/Window/beforeunload_event

    Совместимость с браузерами

    - +

    {{Compat("api.Window.beforeunload_event")}}

    diff --git a/files/ru/web/api/xmlhttprequest/timeout/index.html b/files/ru/web/api/xmlhttprequest/timeout/index.html index 47631f9455..997fb3eb94 100644 --- a/files/ru/web/api/xmlhttprequest/timeout/index.html +++ b/files/ru/web/api/xmlhttprequest/timeout/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/XMLHttpRequest/timeout
    -
    Примечание: Вы не можете использовать таймаут для синхронных запросов с окном - владельцем.
    +
    Примечание: вы не можете использовать таймаут для синхронных запросов с окном - владельцем.
    Использование таймаута с асинхронными запросами
    diff --git a/files/ru/web/css/_colon_where/index.html b/files/ru/web/css/_colon_where/index.html index 5a7b922577..adeef0cdd4 100644 --- a/files/ru/web/css/_colon_where/index.html +++ b/files/ru/web/css/_colon_where/index.html @@ -113,7 +113,7 @@ footer p:hover {

    В то время как, селекторы перечисленные внутри :where() имеют нулевую специфичность, поэтому оранжевая ссылка в футере будет переопределена простым селектором и станет синего цвета.

    -

    Примечание: Вы так же можете найти этот пример на Github; смотрите is-where.

    +

    Примечание: вы так же можете найти этот пример на Github; смотрите is-where.

    {{EmbedLiveSample('Examples', '100%', 600)}}

    diff --git a/files/ru/web/css/align-content/index.html b/files/ru/web/css/align-content/index.html index 3d023aba2c..f91c5764fc 100644 --- a/files/ru/web/css/align-content/index.html +++ b/files/ru/web/css/align-content/index.html @@ -11,7 +11,7 @@ translation_of: Web/CSS/align-content
    {{EmbedInteractiveExample("pages/css/align-content.html")}}
    - +

    Это свойство не влияет на однострочные flex-контейнеры (т.е. с flex-wrap: nowrap)

    diff --git a/files/ru/web/css/css_animations/using_css_animations/index.html b/files/ru/web/css/css_animations/using_css_animations/index.html index 14ccbe0a77..d385be5f08 100644 --- a/files/ru/web/css/css_animations/using_css_animations/index.html +++ b/files/ru/web/css/css_animations/using_css_animations/index.html @@ -18,14 +18,14 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy

    Есть три преимущества CSS-анимации перед традиционными способами:

      -
    1. Простота использования для простых анимаций; Вы можете создать анимацию, не зная JavaScript.
    2. +
    3. Простота использования для простых анимаций; вы можете создать анимацию, не зная JavaScript.
    4. Анимации будут хорошо работать даже при умеренных нагрузках системы. Простые анимации на JavaScript, если они плохо написаны, часто выполняются плохо. Движок может использовать frame-skipping и другие техники, чтобы сохранить производительность на таком высоком уровне .
    5. Позволяет браузеру контролировать последовательность анимации, тем самым оптимизируя производительность и эффективность браузера. Например, уменьшая частоту обновления кадров анимации в непросматриваемых в данный момент вкладках.

    Конфигурирование анимации

    -

    Чтобы создать CSS-анимацию Вы должны добавить в стиль элемента, который хотите анимировать, свойство {{ cssxref("animation") }} или его подсвойства. Это позволит Вам настроить ускорение и продолжительность анимации, а также другие детали того, как анимация должна протекать. Это не поможет Вам настроить внешний вид анимации, который настраивается с помощью {{ cssxref("@keyframes") }}, рассматриваемой далее в {{ anch("Определение последовательности анимации с помощью ключевых кадров") }}.

    +

    Чтобы создать CSS-анимацию вы должны добавить в стиль элемента, который хотите анимировать, свойство {{ cssxref("animation") }} или его подсвойства. Это позволит вам настроить ускорение и продолжительность анимации, а также другие детали того, как анимация должна протекать. Это не поможет вам настроить внешний вид анимации, который настраивается с помощью {{ cssxref("@keyframes") }}, рассматриваемой далее в {{ anch("Определение последовательности анимации с помощью ключевых кадров") }}.

    Свойство {{ cssxref("animation") }} имеет следующие подсвойства:

    @@ -39,7 +39,7 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy
    {{ cssxref("animation-delay") }}
    Настраивает задержку между временем загрузки элемента и временем начала анимации.
    {{ cssxref("animation-iteration-count") }}
    -
    Определяет количество повторений анимации; Вы можете использовать значение infinite для бесконечного повторения анимации.
    +
    Определяет количество повторений анимации; вы можете использовать значение infinite для бесконечного повторения анимации.
    {{ cssxref("animation-direction") }}
    Даёт возможность при каждом повторе анимации идти по альтернативному пути, либо сбросить все значения и повторить анимацию.
    {{ cssxref("animation-fill-mode") }}
    @@ -58,7 +58,7 @@ original_slug: Web/CSS/CSS_Animations/Ispolzovanie_CSS_animatciy

    Примеры

    -
    Внимание: Примеры ниже не используют префиксов для CSS стилей . Webkit-браузеры и старые версии других браузеров нуждаются в указании префиксов в CSS стилях. Примеры, на которые Вы можете кликнуть в своём браузере, также содержат префиксы -webkit-.
    +
    Внимание: Примеры ниже не используют префиксов для CSS стилей . Webkit-браузеры и старые версии других браузеров нуждаются в указании префиксов в CSS стилях. Примеры, на которые вы можете кликнуть в своём браузере, также содержат префиксы -webkit-.

    Скольжение текста

    @@ -326,7 +326,7 @@ e.addEventListener("animationiteration", listener, false); e.className = "slidein"; -

    Это довольно стандартный код; Вы можете получить дополнительную информацию в документации {{ domxref("element.addEventListener()") }}. Последнее, что делает этот код - это установка класса "slidein" для анимируемого элемента; мы делаем это, чтобы запустить анимацию.

    +

    Это довольно стандартный код; вы можете получить дополнительную информацию в документации {{ domxref("element.addEventListener()") }}. Последнее, что делает этот код - это установка класса "slidein" для анимируемого элемента; мы делаем это, чтобы запустить анимацию.

    Почему? Потому что в нашем случае событие animationstart происходит как только анимация стартует, и это происходит раньше, чем исполняется наш сценарий. Так мы сможем контролировать начало анимации самостоятельно посредством вставки класса "slidein" для анимируемого элемента.

    diff --git a/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html b/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html index 874e9a5982..f112da5488 100644 --- a/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html +++ b/files/ru/web/css/css_flexible_box_layout/basic_concepts_of_flexbox/index.html @@ -95,7 +95,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox

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

    -

    Чтобы включить такое поведение, добавьте параметр {{cssxref("flex-wrap")}} со значением wrap. Теперь, как только ваши элементы будут слишком большими для того, чтобы влезать на одну строчку, они будут переноситься на новые строки. Живой пример ниже содержит широкие элементы, у которых общая ширина больше, чем размер контейнера. Так как параметр flex-wrap установлен в значение wrap, элементы переносятся. Если Вы установите значение nowrap, то есть в начальное значение, то элементы ужмутся так, чтобы все элементы поместились на одной строке, потому что у них установлено значение, позволяющее им ужиматься при необходимости. Если им запретить ужиматься, или если они не смогут ужаться достаточно сильно, то при установленном значении nowrap будет происходить переполнение контейнера.

    +

    Чтобы включить такое поведение, добавьте параметр {{cssxref("flex-wrap")}} со значением wrap. Теперь, как только ваши элементы будут слишком большими для того, чтобы влезать на одну строчку, они будут переноситься на новые строки. Живой пример ниже содержит широкие элементы, у которых общая ширина больше, чем размер контейнера. Так как параметр flex-wrap установлен в значение wrap, элементы переносятся. Если вы установите значение nowrap, то есть в начальное значение, то элементы ужмутся так, чтобы все элементы поместились на одной строке, потому что у них установлено значение, позволяющее им ужиматься при необходимости. Если им запретить ужиматься, или если они не смогут ужаться достаточно сильно, то при установленном значении nowrap будет происходить переполнение контейнера.

    {{EmbedGHLiveSample("css-examples/flexbox/basics/flex-wrap.html", '100%', 400)}}

    diff --git a/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html b/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html index 92c797bcf4..6388e20244 100644 --- a/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html +++ b/files/ru/web/css/css_flexible_box_layout/mastering_wrapping_of_flex_items/index.html @@ -77,7 +77,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items

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

    -

    В следующем живом примере у нас показан флекс-контейнер со параметров "перенос" в состоянии "не переносить". Третий элемент имеет контента больше, чем другие элементы. И у него установлен параметр visibility: collapse. Следовательно он имеет некую "распорку", которая удерживает ту высоту, которая позволит показать этот элемент. Если Вы удалите visibility: collapse из CSS или измените значение на visible, то вы увидите, что элемент исчезнет, а пространство перераспределится между не свёрнутыми элементами; высота флекс-контейнера при этом не изменится.

    +

    В следующем живом примере у нас показан флекс-контейнер со параметров "перенос" в состоянии "не переносить". Третий элемент имеет контента больше, чем другие элементы. И у него установлен параметр visibility: collapse. Следовательно он имеет некую "распорку", которая удерживает ту высоту, которая позволит показать этот элемент. Если вы удалите visibility: collapse из CSS или измените значение на visible, то вы увидите, что элемент исчезнет, а пространство перераспределится между не свёрнутыми элементами; высота флекс-контейнера при этом не изменится.

    Примечание. Используйте Firefox для двух приведённых ниже примеров, поскольку Chrome и Safari рассматривают свёрнутый элемент как скрытый.

    @@ -85,7 +85,7 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items

    {{EmbedGHLiveSample("css-examples/flexbox/wrapping/visibility-collapse.html", '100%', 650)}}

    -

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

    +

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

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

    @@ -93,8 +93,8 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items

    {{EmbedGHLiveSample("css-examples/flexbox/wrapping/wrapped-visibility-collapse.html", '100%', 750)}}

    -

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

    +

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

    Разница между visibility: hidden и display: none

    -

    Когда Вы устанавливаете элементу display: none чтобы его спрятать, то этот элемент удаляется из структуры страницы. На практике это означает, что счётчики игнорируют его, а такие вещи, как transitions (переходы), не запускаются. Использование visibility: hidden сохраняет элемент в структуре форматирования, что полезно, поскольку он по-прежнему ведёт себя так, как если бы он был частью макета, даже если пользователь не может его увидеть.

    +

    Когда вы устанавливаете элементу display: none чтобы его спрятать, то этот элемент удаляется из структуры страницы. На практике это означает, что счётчики игнорируют его, а такие вещи, как transitions (переходы), не запускаются. Использование visibility: hidden сохраняет элемент в структуре форматирования, что полезно, поскольку он по-прежнему ведёт себя так, как если бы он был частью макета, даже если пользователь не может его увидеть.

    diff --git a/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html b/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html index 964f414675..0bf469ac46 100644 --- a/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html +++ b/files/ru/web/css/css_grid_layout/basic_concepts_of_grid_layout/index.html @@ -236,7 +236,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout

    Явный и неявный грид

    -

    Во всех примерах выше мы создавали наши колоночные (столбцовые) треки с помощью свойства {{cssxref("grid-template-columns")}}, в то время как грид самостоятельно создавал строки (ряды, полосы) для любого контента там, где это требовалось. Эти строки создавались в неявном гриде. Явный грид состоит из строк и колонок, которые мы определяем с помощью {{cssxref("grid-template-columns")}} и {{cssxref("grid-template-rows")}}. Если Вы размещаете что-нибудь вне рамок определённого данными свойствами грида или в зависимости от контента требуется большее количество грид-треков, грид создаёт строки и колонки в виде неявного грида. Размер подобных треков по умолчанию задаётся автоматически в зависимости от находящегося в них контента.

    +

    Во всех примерах выше мы создавали наши колоночные (столбцовые) треки с помощью свойства {{cssxref("grid-template-columns")}}, в то время как грид самостоятельно создавал строки (ряды, полосы) для любого контента там, где это требовалось. Эти строки создавались в неявном гриде. Явный грид состоит из строк и колонок, которые мы определяем с помощью {{cssxref("grid-template-columns")}} и {{cssxref("grid-template-rows")}}. Если вы размещаете что-нибудь вне рамок определённого данными свойствами грида или в зависимости от контента требуется большее количество грид-треков, грид создаёт строки и колонки в виде неявного грида. Размер подобных треков по умолчанию задаётся автоматически в зависимости от находящегося в них контента.

    Вы также можете задать размер треков, создаваемых в виде неявного грида с помощью свойств {{cssxref("grid-auto-rows")}} и {{cssxref("grid-auto-columns")}}.

    @@ -401,7 +401,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout

    {{ EmbedLiveSample('Размещение_элементов_по_линиям', '230', '420') }}

    -

    Не забывайте, что Вы можете использовать Grid Inspector в Firefox Developer Tools, чтобы посмотреть, как элементы размещаются по линиям грида.

    +

    Не забывайте, что вы можете использовать Grid Inspector в Firefox Developer Tools, чтобы посмотреть, как элементы размещаются по линиям грида.

    Grid-ячейки

    @@ -521,7 +521,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout

    {{ EmbedLiveSample('nesting', '600', '340') }}

    -

    В данном случае вложенный грид не связан с родительским. Как Вы можете видеть, он не наследует значение свойства {{cssxref("grid-gap")}} родительского элемента и линии вложенного грида не выравниваются по линиям родительского грида.

    +

    В данном случае вложенный грид не связан с родительским. Как вы можете видеть, он не наследует значение свойства {{cssxref("grid-gap")}} родительского элемента и линии вложенного грида не выравниваются по линиям родительского грида.

    Подгрид (Subgrid)

    diff --git a/files/ru/web/css/css_grid_layout/grid_template_areas/index.html b/files/ru/web/css/css_grid_layout/grid_template_areas/index.html index 4081789445..bdf9906212 100644 --- a/files/ru/web/css/css_grid_layout/grid_template_areas/index.html +++ b/files/ru/web/css/css_grid_layout/grid_template_areas/index.html @@ -4,7 +4,7 @@ slug: Web/CSS/CSS_Grid_Layout/Grid_Template_Areas translation_of: Web/CSS/CSS_Grid_Layout/Grid_Template_Areas original_slug: Web/CSS/CSS_Grid_Layout/Грид-области --- -

    В предыдущем обзоре мы рассмотрели грид-линии и то, как с их помощью размещать элементы в гридах. Когда Вы работаете с CSS Grid Layout, у Вас всегда есть грид-линии, поэтому они - быстрый, прямой и надёжный способ расположить элементы. Как бы то ни было, существует альтернативный метод, и этот метод можно использовать как в одиночку, так и в сочетании с расположением элементов по грид-линиям. В этом методе элементы располагаются с помощью именованных, заранее определённых грид-областей. Давайте рассмотрим, как он работает, и Вы скоро поймёте, почему его называют методом ascii-искусства в концепции макетов на гридах!

    +

    В предыдущем обзоре мы рассмотрели грид-линии и то, как с их помощью размещать элементы в гридах. Когда вы работаете с CSS Grid Layout, у вас всегда есть грид-линии, поэтому они - быстрый, прямой и надёжный способ расположить элементы. Как бы то ни было, существует альтернативный метод, и этот метод можно использовать как в одиночку, так и в сочетании с расположением элементов по грид-линиям. В этом методе элементы располагаются с помощью именованных, заранее определённых грид-областей. Давайте рассмотрим, как он работает, и вы скоро поймёте, почему его называют методом ascii-искусства в концепции макетов на гридах!

    Имя для грид-области

    @@ -154,7 +154,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области

    {{ EmbedLiveSample('Leaving_a_grid_cell_empty', '300', '330') }}

    -

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

    +

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

    Охватываем несколько ячеек

    @@ -219,7 +219,7 @@ original_slug: Web/CSS/CSS_Grid_Layout/Грид-области

    {{ EmbedLiveSample('Spanning_multiple_cells', '300', '330') }}

    -

    Значение {{cssxref("grid-template-areas")}} должно отображать законченный грид, а иначе оно невалидно (и игнорируется!). Это значит, что у Вас должно быть одинаковое количество ячеек в каждой строке, а если какая-то ячейка должна быть пустой, то вместо имени в ней должна быть точка. Грид будет также невалидным, если области в нем не прямоугольные.

    +

    Значение {{cssxref("grid-template-areas")}} должно отображать законченный грид, а иначе оно невалидно (и игнорируется!). Это значит, что у вас должно быть одинаковое количество ячеек в каждой строке, а если какая-то ячейка должна быть пустой, то вместо имени в ней должна быть точка. Грид будет также невалидным, если области в нем не прямоугольные.

    Переопределение грида с медиавыражениями

    diff --git a/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html b/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html index 6d4d62e90d..043d708e69 100644 --- a/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html +++ b/files/ru/web/css/css_grid_layout/layout_using_named_grid_lines/index.html @@ -300,7 +300,7 @@ translation_of: Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines } -

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

    +

    Если ваш повторяющийся синтаксис помещает две строки рядом друг с другом, то они будут объединены и создадут тот же результат, что и присвоение строке нескольких имён в неповторяющемся определении трека. Следующее определение создаёт четыре трека 1fr, каждый из которых имеет начальную и конечную линии.

    .wrapper {
       grid-template-columns: repeat(4, [col-start] 1fr [col-end] );
    diff --git a/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html b/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html
    index cbbb43c16f..682f3051b8 100644
    --- a/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html
    +++ b/files/ru/web/css/css_grid_layout/line-based_placement_with_css_grid/index.html
    @@ -13,13 +13,13 @@ original_slug: >-
     ---
     

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

    -

    Собственно, начать квест по гридам со знакомства с пронумерованными линиями - логично, потому что в ситуации, когда Вы работаете с гридами, пронумерованные линии у Вас есть всегда. Линии нумеруются и для колонок, и для строк, отсчёт начинается с 1. Нужно заметить, что грид индексируется в соответствии с режимом написания (writing mode) документа. В языках с написанием слева направо, таких как русский, например, линия 1 - самая левая линия грида. Если написание справа налево, то линия 1 будет, соответственно, самой правой линией в гриде. По ходу изучения недр мы детально узнаем, как гриды взаимодействуют с режимами написания, поэтому не исчезайте, впереди много интересного.

    +

    Собственно, начать квест по гридам со знакомства с пронумерованными линиями - логично, потому что в ситуации, когда вы работаете с гридами, пронумерованные линии у вас есть всегда. Линии нумеруются и для колонок, и для строк, отсчёт начинается с 1. Нужно заметить, что грид индексируется в соответствии с режимом написания (writing mode) документа. В языках с написанием слева направо, таких как русский, например, линия 1 - самая левая линия грида. Если написание справа налево, то линия 1 будет, соответственно, самой правой линией в гриде. По ходу изучения недр мы детально узнаем, как гриды взаимодействуют с режимами написания, поэтому не исчезайте, впереди много интересного.

    Базовый пример

    В качестве крайне простого примера давайте возьмём грид с тремя треками-колонками и тремя треками-строками. Такой грид даёт нам по 4 линии для каждого направления.

    -

    Внутри нашего грид-контейнера у нас есть четыре дочерних элемента. Если мы не размещаем их явным образом, эти элементы будут расположены в гриде в соответствии с правилами авторазмещения, то есть, по одному элементу - в каждой из четырёх первых ячеек. Если Вы воспользуетесь Firefox Grid Highlighter , то увидите, как грид инициирует колонки и строки.

    +

    Внутри нашего грид-контейнера у нас есть четыре дочерних элемента. Если мы не размещаем их явным образом, эти элементы будут расположены в гриде в соответствии с правилами авторазмещения, то есть, по одному элементу - в каждой из четырёх первых ячеек. Если вы воспользуетесь Firefox Grid Highlighter , то увидите, как грид инициирует колонки и строки.

    Our Grid highlighted in DevTools

    @@ -72,7 +72,7 @@ original_slug: >- }
    -

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

    +

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

    Задавая адреса для каждого элемента по отдельности, мы можем разместить все наши четыре элемента по колонкам и строкам. Заметьте, что при желании можно оставить ячейки пустыми. Одна из самых приятных вещей при работе с Grid Layout - возможность создавать негативное пространство (пустые области в макете) без кувырков через голову и прочих хаков.

    @@ -187,7 +187,7 @@ original_slug: >-

    Расположение элемента по умолчанию

    -

    В примерах выше мы задавали конечную линию для строки и колонки, чтобы продемонстрировать работу свойств, однако, если элемент занимает только один трек, Вы можете опустить значение grid-column-end или grid-row-end. Грид по умолчанию размещает элемент таким образом, чтобы он занимал всего один трек. Это значит, что длинная запись свойств в нашем первоначальном примере может выглядеть вот так:

    +

    В примерах выше мы задавали конечную линию для строки и колонки, чтобы продемонстрировать работу свойств, однако, если элемент занимает только один трек, вы можете опустить значение grid-column-end или grid-row-end. Грид по умолчанию размещает элемент таким образом, чтобы он занимал всего один трек. Это значит, что длинная запись свойств в нашем первоначальном примере может выглядеть вот так: