Koda

Använd <code> för inline-kod och <pre class="prettyprint"> för kodblock. Syntaxmarkeringen fungerar bra för många språk, inklusive XML- och HTML-exempel. Du kan utelämna class="prettyprint" om syntaxmarkeringen inte är lämplig för exemplet, till exempel för konsolkommandon eller långa tjänstslutpunkts-URL:er.

Överskrid inte 100 tecken kod per rad i ett <pre> -block. I DevSite får exakt 100 tecken kod plats på större skärmar innan horisontell rullning börjar. På mindre skärmar rullar kodblock horisontellt vid behov. 80 tecken passar på i stort sett vilken bärbar dator som helst.

#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>

Du skulle vanligtvis utelämna class="prettyprint" från <pre> för konsolkommandon. Till exempel:

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

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

Klicka för att kopiera

En klicka för att kopiera-knapp visas automatiskt på alla kodblock med klassen prettyprint .

För att använda click-to-copy på ett kodblock eller annat element som inte har klassen prettyprint , lägg till klassen 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>

Inaktivera klicka för att kopiera på ett kodblock

För att inaktivera click-to-copy på ett prettyprint -kodblock, lägg till klassen 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>

För att inaktivera klicka för att kopiera på ett Markdown-kodblock använder du följande syntax när du öppnar kodstängslet för att tillämpa stilen devsite-disable-click-to-copy :

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

Inaktivera klicka för att kopiera på en del av ett kodblock

För att förhindra kopiering av en del av ett kodblock, lägg till en <span> -tagg med klassen no-select runt delen som du inte vill kopiera: 

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

I exemplet nedan ignorerar både manuell kopiering och klicka-för-kopiera-knappen den kommenterade delen:

C:\\> ping google.com

Klicka för att kopiera analytiska händelser

Ställ in attributet data-copy-event-label för att göra analyshändelser otydliga för klicka för att kopiera. 

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

Klicka för att kopiera och tillgänglighet

Som standard har alla klicka för att kopiera kodexempel samma etikett för varje klicka för att kopiera-knapp: "Kopiera kodexempel." På sidor med flera kodexempel kan detta göra det svårt att navigera med en skärmläsare.

För tillgänglighet ger varje klick-för-kopiera-kodexempel ett data-label som kort och koncist anger innehållet i varje kodexempel. Varje kodexempeletikett ska vara unik i förhållande till alla andra kodexempeletiketter på sidan; den här etiketten läses av skärmläsare förutom "Kopiera kodexempel." {:.devsite-click-to-copy} <pre class="devsite-click-to-copy" data-label="Installation script"></pre>

Inaktiverar ljus/mörker-växling

För att inaktivera växlingsknappen ljus/mörkt på ett kodblock, lägg till klassen devsite-disable-code-toggle : 

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

För att inaktivera växlingsknappen ljus/mörkt på ett Markdown-kodblock använder du följande syntax när du öppnar kodstängslet för att tillämpa klassen devsite-disable-code-toggle : 

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

Mörk kod som standard

För att få ett kodblock att använda mörk kodstil som standard, lägg till klassen devsite-dark-code-default : 

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

Forcera linlindning

Som standard läggs en horisontell rullningslist till för rader i ett <pre> -block som överstiger 100 tecken. 

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)

För att åsidosätta detta beteende och radbryta raderna istället, lägg till class="wrap-code" i <pre> -blocket. 

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)

Koda: 

<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>

Terminalkod

När du demonstrerar kod för terminalen rekommenderar vi att författare använder $ för att indikera ett nytt terminalkommando. För att lägga till $ i början av innehållet i en <pre> -behållare utan att lägga till den i användarens kopierade kod, applicera class="devsite-terminal" på <pre> -elementet.

adb devices

Koda: 

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

För att lägga till $ i början av en enda rad med terminalkod, använd class="devsite-terminal" på <code> -elementet som innehåller den raden. Använd denna taktik för fall med $ på flera rader. 

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

Koda: 

<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

Om du vill använda ett anpassat prefix lägger du till attributet data-terminal-prefix till <pre> eller <code> -elementet där klassen tillämpades. 

Install-Package Google.Apis.Calendar.v3

Koda: 

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

Alla instanser av prefixet som lagts till med klassen "devsite-terminal" kommer att exkluderas från användarens kopierade kod.

Markering

Använd <strong> för att uppmärksamma innehåll i ett <pre> -block. Om du gör det blir det omgivande innehållet ljusare för att framhäva avsnittet som markeras av <strong> -blocket. Till exempel: 

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

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

Koda: 

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

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

Utbytbara variabler

Använd <var> och versaler med understreck för utbytbar text inom <pre> . Till exempel: 

dev_appserver.py YOUR_APP_DIR.

Koda: 

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

I Markdown, omslut <var> -taggarna inom citattecken och använd Jinja-uttrycksparenteser för att undvika taggarna, så här: VAR_NAME .

Till exempel: 

Hello, my name is YOUR_NAME.

Koda: 

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

Prissänkning

Du kan också specificera kodblock med Markdown med antingen 4-stegs indrag i koden eller stängsel av den med 3 backticks (```).

Till exempel: 

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

    print("hello world")

båda blir 

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

Om du använder inhägnade kodblock (och inte indragna kodblock), kan du också ange språket för prettyprint för att förstå det: 

print("hello world")

blir 

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

Du kan hitta listan över erkända språk i Prettify-dokumentationen .

Alla kodblock som görs genom Markdown kommer att ha klassen prettyprint applicerad på sig, såvida inte språket uttryckligen anges till inget. Du kan lägga till ytterligare klasser i kodblocket genom att använda anpassade attribut : 

The program completed successfully.

blir 

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