From c058fa0fb22dc40ef0225b21a97578cddd0aaffa Mon Sep 17 00:00:00 2001 From: Florian Merz Date: Thu, 11 Feb 2021 14:51:05 +0100 Subject: unslug ru: move --- .../index.html" | 181 --------------------- 1 file changed, 181 deletions(-) delete mode 100644 "files/ru/mdn/editor/\321\201\320\270\320\275\321\202\320\260\320\272\321\201\320\270\321\207\320\265\321\201\320\272\320\270\320\265_\320\262\321\213\320\264\320\265\320\273\320\265\320\275\320\270\321\217/index.html" (limited to 'files/ru/mdn/editor/синтаксические_выделения/index.html') diff --git "a/files/ru/mdn/editor/\321\201\320\270\320\275\321\202\320\260\320\272\321\201\320\270\321\207\320\265\321\201\320\272\320\270\320\265_\320\262\321\213\320\264\320\265\320\273\320\265\320\275\320\270\321\217/index.html" "b/files/ru/mdn/editor/\321\201\320\270\320\275\321\202\320\260\320\272\321\201\320\270\321\207\320\265\321\201\320\272\320\270\320\265_\320\262\321\213\320\264\320\265\320\273\320\265\320\275\320\270\321\217/index.html" deleted file mode 100644 index f959ae7809..0000000000 --- "a/files/ru/mdn/editor/\321\201\320\270\320\275\321\202\320\260\320\272\321\201\320\270\321\207\320\265\321\201\320\272\320\270\320\265_\320\262\321\213\320\264\320\265\320\273\320\265\320\275\320\270\321\217/index.html" +++ /dev/null @@ -1,181 +0,0 @@ ---- -title: Синтаксические выделения -slug: MDN/Editor/Синтаксические_выделения -tags: - - Guide - - Howto - - MDN - - MDN Meta - - Редактор - - Руководство - - выделение -translation_of: MDN/Editor/Syntax_highlighting ---- -
{{MDNSidebar}}
- -

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

- -

Поддержка синтаксических выделений

- -

MDN поддерживает все переодически используемые нами на MDN языки (так же, как и те, что используются лишь иногда):

- -
- -
- -

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

- -

Добавление выделения

- -

Как правило, следует выделять любой блок {{HTMLElement("pre")}}, который представляет код, состоящий из более чем одной строчки; выделение однострочного кода будет зависеть от контекста.

- -

Синтаксические выделения в примерах кода:

- -
    -
  1. -

    Наберите или вставьте код в статью. Например:

    - -

    void main(int argc, char **argv) {

    - -

    printf("Привет, мир!\n");

    - -

    }

    -
    2. -
  2. -

    Выделите текст и нажмите кнопку PRE в панели инструментов. Результат:

    - - 
    void main(int argc, char **argv) {
-
-printf("Hello world\n");
-
-}
-
    -
    3. -
  3. -

    Нажмите кнопку Syntax Highlighter и выберите название соответстующего коду языка программирования. В нашем примере это C/C++:

    - - 
    void main(int argc, char **argv) {
-
-printf("Hello world\n");
-
-}
    -
    4. -
- -

Вы можете немного упростить процесс, не нажимая кнопку PRE и сразу выбрав нужный вам язык. Добавление выделения автоматически вставит необходимый блок {{HTMLElement("pre")}}, если он ещё не на месте.

- -

Далее представлен перевод раздела {{SectionOnPage("/en-US/docs/MDN/Contribute/Editor/Source_mode", "Выделение строк в режиме источника")}}:

- -

Выделение линий в примере

- -

Блоки примеров кода устанавливаются кнопками PRE или Syntax Highlighter в блоках панели инструментов, но вы, возможно, захотите обратить внимание читателей на определённые строки кода. Единственный способ сделать это — открыть режим источника, найти там блок <pre>, содержащий код, и добавить в атрибут class тега <pre>  компонент highlight, отформатированный следующим образом:

- - - -
"hightlight[" <список-номеров-строк> "]"
-
-Где:
-<список-номеров-строк> = [ <номер-строки> | <диапазон-строк> ]#
-<диапазон-строк> = <номер-строки> - <line-number>
-<номер-строки> = <токен>
- -

К примеру, если есть тег <pre class="brush: js;">, и вы хотите выделить строки 4 и 7, то вы меняете тег: <pre class="brush: js; highlight[4, 7]">.

- -

Давайте взглянем на более полный пример:

- -
- - - - - - - - - - - - - -
До выделенияС выделением
- 
-var canvas = document.getElementById("canvas");
-var ctx = canvas.getContext("2d");
-
-var path1 = new Path2D();
-path1.rect(10, 10, 100, 100);
-
-var path2 = new Path2D(path1);
-path2.moveTo(220, 60);
-path2.arc(170, 60, 50, 0, 2 * Math.PI);
-
-ctx.stroke(path2);
-
- -

Здесь тег {{HTMLElement("pre")}} равен: <pre class="brush: js;">

- 		- 
-var canvas = document.getElementById("canvas");
-var ctx = canvas.getContext("2d");
-
-var path1 = new Path2D();
-path1.rect(10, 10, 100, 100);
-
-var path2 = new Path2D(path1);
-path2.moveTo(220, 60);
-path2.arc(170, 60, 50, 0, 2 * Math.PI);
-
-ctx.stroke(path2);
- -

А здесь тег <pre> был изменён на: <pre class="brush: js; highlight[4, 7]">

-
-
- -
-

Выделенные строки не отображаются в редакторе MDN.

-
- -

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

- - - -
{{EditorGuideQuicklinks}}
-- cgit v1.2.3-54-g00ecf