本頁面由 Cloud Translation API 翻譯而成。

程式碼

請使用 <code> 表示內嵌程式碼，使用 <pre class="prettyprint"> 表示程式碼區塊。語法醒目顯示功能適用於許多語言，包括 XML 和 HTML 範例。如果語法醒目顯示不適合範例 (例如主控台指令或長服務端點網址)，您可以省略 class="prettyprint"。

<pre> 區塊中每行程式碼不得超過 100 個半形字元。在 DevSite 中，如果畫面較大，則最多只能顯示 100 個字元的程式碼，否則就會啟動橫向捲動功能。在較小的螢幕上，程式碼區塊會在必要時水平捲動畫面。80 個半形字元幾乎可在任何筆記型電腦上顯示。

#include <stdio.h>

/* Counting example */
int main(int argc, char** argv) {
    int i;

    // This counts from 0 to 9.
    for (i = 0; i < 10; i++) {
        printf("Counting %d\n", i);
    }
}

<pre class="prettyprint">
#include <stdio.h>

/* Counting example */
int main(int argc, char** argv) {
    int i;

    // This counts from 0 to 9.
    for (i = 0; i < 10; i++) {
        printf("Counting %d\n", i);
    }
}
</pre>

通常您會在控制台指令中省略 <pre> 中的 class="prettyprint"。例如：

dev_appserver.py -a $HOST --debug demos/getstarted

<pre>dev_appserver.py -a $HOST --debug demos/getstarted</pre>

點選複製

所有含有 prettyprint 類別的程式碼區塊都會自動顯示按一下即可複製的按鈕。

如要在沒有 prettyprint 類別的程式碼區塊或其他元素上使用點選複製功能，請新增 devsite-click-to-copy 類別： some_terminal_command.py --users_should_copy <pre class="devsite-click-to-copy">some_terminal_command.py --users_should_copy</pre>

停用程式碼區塊的點選複製功能

如要停用 prettyprint 程式碼區塊的點選複製功能，請新增 devsite-disable-click-to-copy 類別：

www.example-url-that-does-not-make-sense-to-copy.com

<pre class="prettyprint devsite-disable-click-to-copy">www.example-url-that-does-not-make-sense-to-copy.com</pre>

如要停用 Markdown 程式碼區塊的點選複製功能，請在開啟程式碼圍欄時使用下列語法，以套用 devsite-disable-click-to-copy 樣式：

{:.devsite-disable-click-to-copy}

停用程式碼區塊部分內容的點選複製功能

如要避免複製程式碼區塊的部分內容，請在您不想複製的部分周圍加上 <span> 標記，並指定 no-select 類別：

<span class="no-select">C:\> </span>ping google.com

在以下範例中，手動複製和點按複製按鈕都會忽略註解部分：

C:\\> ping google.com

點按複製 Analytics 事件

如要區分點擊複製的數據分析事件，請設定 data-copy-event-label 屬性。

data-copy-event-label

<pre class="devsite-terminal devsite-click-to-copy" data-copy-event-label="unique_identifier"></pre>

點按複製和無障礙

根據預設，所有點按複製程式碼範例的按鈕都會顯示相同的標籤：「Copy code sample」。在包含多個程式碼範例的網頁上，這可能會導致使用螢幕閱讀器時的瀏覽體驗不佳。

為方便使用者存取，請為每個點按複製的程式碼範例提供 data-label 屬性，簡短扼要地標示每個程式碼範例的內容。每個程式碼範例標籤都應與頁面上的其他程式碼範例標籤不同；除了「複製程式碼範例」之外，這個標籤也會由螢幕閱讀器讀取。 {:.devsite-click-to-copy} <pre class="devsite-click-to-copy" data-label="Installation script"></pre>

停用淺色/深色切換按鈕

如要停用程式碼區塊上的淺色/深色切換按鈕，請新增 devsite-disable-code-toggle 類別：

<pre class="prettyprint devsite-disable-code-toggle"></pre>

如要停用 Markdown 程式碼區塊上的淺色/深色切換按鈕，請在開啟程式碼圍欄以套用 devsite-disable-code-toggle 類別時，使用以下語法：

``` {.devsite-disable-code-toggle}

預設使用深色程式碼

如要讓程式碼區塊預設使用深色程式碼樣式，請新增 devsite-dark-code-default 類別：

<pre class="prettyprint devsite-dark-code-default"></pre>

強制換行

根據預設，如果 <pre> 區塊中的行超過 100 個半形字元，系統會新增水平捲軸。

run(dataset: google.cloud.aiplatform.datasets.time_series_dataset.TimeSeriesDataset, target_column: str, time_column: str, time_series_identifier_column: str, unavailable_at_forecast_columns: List[str], available_at_forecast_columns: List[str], forecast_horizon: int, data_granularity_unit: str, data_granularity_count: int, training_fraction_split: Optional[float] = None, validation_fraction_split: Optional[float] = None, test_fraction_split: Optional[float] = None, predefined_split_column_name: Optional[str] = None, weight_column: Optional[str] = None, time_series_attribute_columns: Optional[List[str]] = None, context_window: Optional[int] = None, export_evaluated_data_items: bool = False, export_evaluated_data_items_bigquery_destination_uri: Optional[str] = None, export_evaluated_data_items_override_destination: bool = False, quantiles: Optional[List[float]] = None, validation_options: Optional[str] = None, budget_milli_node_hours: int = 1000, model_display_name: Optional[str] = None, model_labels: Optional[Dict[str, str]] = None, sync: bool = True)

如要覆寫這項行為並改為換行，請將 class="wrap-code" 新增至 <pre> 區塊。

run(dataset: google.cloud.aiplatform.datasets.time_series_dataset.TimeSeriesDataset, target_column: str, time_column: str, time_series_identifier_column: str, unavailable_at_forecast_columns: List[str], available_at_forecast_columns: List[str], forecast_horizon: int, data_granularity_unit: str, data_granularity_count: int, training_fraction_split: Optional[float] = None, validation_fraction_split: Optional[float] = None, test_fraction_split: Optional[float] = None, predefined_split_column_name: Optional[str] = None, weight_column: Optional[str] = None, time_series_attribute_columns: Optional[List[str]] = None, context_window: Optional[int] = None, export_evaluated_data_items: bool = False, export_evaluated_data_items_bigquery_destination_uri: Optional[str] = None, export_evaluated_data_items_override_destination: bool = False, quantiles: Optional[List[float]] = None, validation_options: Optional[str] = None, budget_milli_node_hours: int = 1000, model_display_name: Optional[str] = None, model_labels: Optional[Dict[str, str]] = None, sync: bool = True)

代碼：

<pre class="wrap-code">
run(dataset: google.cloud.aiplatform.datasets.time_series_dataset.TimeSeriesDataset, target_column: str, time_column: str, time_series_identifier_column: str, unavailable_at_forecast_columns: List[str], available_at_forecast_columns: List[str], forecast_horizon: int, data_granularity_unit: str, data_granularity_count: int, training_fraction_split: Optional[float] = None, validation_fraction_split: Optional[float] = None, test_fraction_split: Optional[float] = None, predefined_split_column_name: Optional[str] = None, weight_column: Optional[str] = None, time_series_attribute_columns: Optional[List[str]] = None, context_window: Optional[int] = None, export_evaluated_data_items: bool = False, export_evaluated_data_items_bigquery_destination_uri: Optional[str] = None, export_evaluated_data_items_override_destination: bool = False, quantiles: Optional[List[float]] = None, validation_options: Optional[str] = None, budget_milli_node_hours: int = 1000, model_display_name: Optional[str] = None, model_labels: Optional[Dict[str, str]] = None, sync: bool = True)
</pre>

終端機代碼

在示範終端機程式碼時，我們建議作者使用 $ 表示新的終端機指令。如要將 $ 新增至 <pre> 容器內容開頭，但不加到使用者複製的程式碼中，請將 class="devsite-terminal" 套用至 <pre> 元素。

adb devices

代碼：

<pre class="devsite-terminal devsite-click-to-copy">
adb devices
</pre>

如要在單一終端程式碼行的開頭加上 $，請將 class="devsite-terminal" 套用至包含該行程式碼的 <code> 元素。在多行中使用 $ 的情況下，請使用這項策略。

gradle init --type basic
mkdir -p src/main/java src/main/resources

代碼：

<pre class="prettyprint">
<code class="devsite-terminal">gradle init --type basic</code>
<code class="devsite-terminal">mkdir -p src/main/java src/main/resources</code>
</pre

如要使用自訂前置字元，請將屬性 data-terminal-prefix 新增至套用類別的 <pre> 或 <code> 元素。

Install-Package Google.Apis.Calendar.v3

代碼：

<pre class="devsite-terminal devsite-click-to-copy" data-terminal-prefix="PM&gt; ">
Install-Package Google.Apis.Calendar.v3
</pre>

使用「devsite-terminal」類別新增的前置字元，在使用者複製的程式碼中會遭到排除。

挑染

使用 <strong> 可吸引使用者注意 <pre> 區塊中的內容。這樣做會淡化周圍內容，以強調 <strong> 區塊醒目顯示的部分。例如：

// ...
// ...
// ...
for (i = 0; i < 10; i++) {
    printf("Counting %d\n", i);

    if (i % 3 == 0) {
        someFunc(i);
    }
}
// ...
// ...
// ...

代碼：

<pre class="prettyprint">
// ...
// ...
// ...
for (i = 0; i < 10; i++) {
    printf("Counting %d\n", i);

    <strong>if (i % 3 == 0) {
        someFunc(i);
    }</strong>
}
// ...
// ...
// ...
</pre>

可替換的變數

在 <pre> 中使用 <var> 和大寫字母搭配底線，表示可替換的文字。例如：

dev_appserver.py YOUR_APP_DIR.

代碼：

<pre>dev_appserver.py <var>YOUR_APP_DIR</var></pre>

在 Markdown 中，請在 <var> 標記前後加上引號，並使用 Jinja 運算式方括號逸出標記，例如：VAR_NAME。

例如：

Hello, my name is YOUR_NAME.

代碼：

    ```
    Hello, my name is YOUR_NAME.
    ```

Markdown

您也可以使用 Markdown 指定程式碼區塊，方法是將程式碼縮排 4 個空格，或使用 3 個反引號 (```) 將程式碼包起來。

例如：

    ```
    print("hello world")
    ```

    print("hello world")

兩者都會變成

<pre class="prettyprint notranslate" translate="no"><code>
print("hello world")
</code></pre>

如果您使用的是區隔的程式碼區塊 (而非縮排的程式碼區塊)，也可以指定語言，讓 PrettyPrint 瞭解程式碼：

print("hello world")

會變成

<pre class="prettyprint notranslate lang-py" translate="no"><code>
print("hello world")
</code></pre>

您可以在 Prettify 說明文件中找到支援的語言清單。

除非明確將語言設為無，否則所有透過 Markdown 建立的程式碼區塊都會套用 prettyprint 類別。您可以使用自訂屬性，在程式碼區塊中加入其他類別：

The program completed successfully.

會變成

<pre class="devsite-disable-click-to-copy"><code>The program completed successfully.
</code></pre>