Inline kódhoz használja <code>
, kódblokkokhoz pedig <pre class="prettyprint">
. A szintaktikai kiemelés számos nyelven jól működik, beleértve az XML- és HTML-példákat is. Kihagyhatja class="prettyprint"
ha a szintaxis kiemelése nem megfelelő a példához, például konzolparancsok vagy hosszú szolgáltatásvégpont URL-ek esetén.
Egy <pre>
blokkban ne haladja meg a 100 karakteres kódot soronként. A DevSite-ban pontosan 100 karakternyi kód fér el a nagyobb képernyőkön, mielőtt beindul a vízszintes görgetés. Kisebb képernyőkön a kódblokkok vízszintesen gördülnek, ha szükséges. 80 karakter szinte bármilyen laptopon elfér.
#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>
A konzolparancsoknál általában ki kell hagyni class="prettyprint"
<pre>
-ből. Például:
dev_appserver.py -a $HOST --debug demos/getstarted
<pre>dev_appserver.py -a $HOST --debug demos/getstarted</pre>
Kattintson a másoláshoz
Egy kattintásra másolás gomb automatikusan megjelenik minden kódblokkon a prettyprint
osztályú kóddal.
Ha a click-to-copy funkciót olyan kódblokkon vagy más elemen szeretné használni, amely nem rendelkezik a prettyprint
osztálysal, adja hozzá a devsite-click-to-copy
osztályt: some_terminal_command.py --users_should_copy
<pre class="devsite-click-to-copy">some_terminal_command.py --users_should_copy</pre>
A kattintással történő másolás letiltása egy kódblokkon
A Click-to-Copy letiltásához egy prettyprint
kódblokkon, adja hozzá a devsite-disable-click-to-copy
osztályt:
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>
Ha le szeretné tiltani a kattintásra másolást egy Markdown kódblokkon , használja a következő szintaxist a kódkerítés megnyitásakor a devsite-disable-click-to-copy
stílus alkalmazásához:
{:.devsite-disable-click-to-copy}
A kattintással történő másolás letiltása egy kódblokk egy részén
A kódblokk egy részének másolásának megakadályozása érdekében adjon hozzá egy <span>
címkét a no-select
osztályhoz azon rész köré, amelyet nem szeretne másolni:
<span class="no-select">C:\> </span>ping google.com
Az alábbi példában mind a kézi másolás, mind a kattintással másolás gomb figyelmen kívül hagyja a megjegyzésekkel ellátott részt:
C:\\> ping google.com
Kattintással másolható elemzési események
A kattintással másolható elemzési események egyértelművé tételéhez állítsa be a data-copy-event-label
attribútumot.
data-copy-event-label
<pre class="devsite-terminal devsite-click-to-copy" data-copy-event-label="unique_identifier"></pre>
Kattintással másolható és hozzáférhetőség
Alapértelmezés szerint az összes kattintással másolható kódminta ugyanazzal a címkével rendelkezik minden kattintásra másolás gombhoz: „Kódminta másolása”. A több kódmintát tartalmazó oldalakon ez megnehezítheti a képernyőolvasóval történő navigálást.
A hozzáférhetőség érdekében minden kattintással másolható kódmintát biztosítson egy data-label
attribútummal, amely röviden és tömören felcímkézi az egyes kódminták tartalmát. Minden kódminta címkének egyedinek kell lennie az oldalon található összes többi kódminta címkéhez képest; ezt a címkét a képernyőolvasók olvassák a „Kódminta másolása” mellett. {:.devsite-click-to-copy} <pre class="devsite-click-to-copy" data-label="Installation script"></pre>
Világos/sötét váltás letiltása
A világos/sötét váltógomb kódblokkon letiltásához adja hozzá a devsite-disable-code-toggle
osztályt:
<pre class="prettyprint devsite-disable-code-toggle"></pre>
Ha le szeretné tiltani a világos/sötét váltógombot egy Markdown kódblokkon , használja a következő szintaxist a kódkerítés megnyitásakor a devsite-disable-code-toggle
osztály alkalmazásához:
``` {.devsite-disable-code-toggle}
Alapértelmezés szerint sötét kód
Ahhoz, hogy egy kódblokk alapértelmezés szerint sötét kódstílust használjon, adja hozzá a devsite-dark-code-default
osztályt:
<pre class="prettyprint devsite-dark-code-default"></pre>
Force vonal tekercselés
Alapértelmezés szerint egy vízszintes görgetősáv kerül hozzáadásra az <pre>
blokk 100 karakternél hosszabb soraihoz.
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)
Ennek a viselkedésnek a felülírásához és a sorok tördeléséhez adja hozzá class="wrap-code"
a <pre>
blokkhoz.
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)
Kód:
<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>
Terminál kód
A terminál kódjának bemutatásakor azt javasoljuk, hogy a szerzők $
használják az új terminálparancs jelzésére. Ha $
hozzá szeretné adni egy <pre>
tároló tartalmának elejéhez anélkül, hogy hozzáadná a felhasználó másolt kódjához, alkalmazza class="devsite-terminal"
a <pre>
elemre.
adb devices
Kód:
<pre class="devsite-terminal devsite-click-to-copy">
adb devices
</pre>
Ha $
szeretne hozzáadni a terminálkód egyetlen sorának elejéhez, alkalmazza class="devsite-terminal"
az adott sort tartalmazó <code>
elemre. Használja ezt a taktikát olyan esetekben, amikor $
több sorban van.
gradle init --type basic
mkdir -p src/main/java src/main/resources
Kód:
<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
Egyéni előtag használatához adja hozzá a data-terminal-prefix
attribútumot ahhoz a <pre>
vagy <code>
elemhez, ahol az osztályt alkalmazták.
Install-Package Google.Apis.Calendar.v3
Kód:
<pre class="devsite-terminal devsite-click-to-copy" data-terminal-prefix="PM> ">
Install-Package Google.Apis.Calendar.v3
</pre>
A "devsite-terminal" osztály használatával hozzáadott előtag minden példánya ki lesz zárva a felhasználó másolt kódjából.
Kiemelés
<strong>
használatával hívja fel a figyelmet egy <pre>
blokkon belüli tartalomra. Ezzel világosabbá válik a környező tartalom, és kiemeli a <strong>
blokk által kiemelt részt. Például:
// ... // ... // ... for (i = 0; i < 10; i++) { printf("Counting %d\n", i); if (i % 3 == 0) { someFunc(i); } } // ... // ... // ...
Kód:
<pre class="prettyprint">
// ...
// ...
// ...
for (i = 0; i < 10; i++) {
printf("Counting %d\n", i);
<strong>if (i % 3 == 0) {
someFunc(i);
}</strong>
}
// ...
// ...
// ...
</pre>
Cserélhető változók
Használja <var>
és a nagybetűket aláhúzással <pre>
-en belüli cserélhető szöveghez. Például:
dev_appserver.py YOUR_APP_DIR.
Kód:
<pre>dev_appserver.py <var>YOUR_APP_DIR</var></pre>
A Markdown alkalmazásban tegye idézőjelek közé a <var>
címkéket, és használja a Jinja kifejezési zárójeleket a címkék kihagyásához, például: VAR_NAME
.
Például:
Hello, my name is YOUR_NAME.
Kód:
```
Hello, my name is YOUR_NAME.
```
Árleszállítás
Kódblokkokat is megadhat a Markdown használatával, 4 szóközzel behúzva a kódot, vagy elkerítve 3 backtick-el (```).
Például:
```
print("hello world")
```
print("hello world")
mindketten válnak
<pre class="prettyprint notranslate" translate="no"><code>
print("hello world")
</code></pre>
Ha elkerített kódblokkokat (és nem behúzott kódblokkokat) használ, megadhatja a prettyprint nyelvét is, hogy megértse:
print("hello world")
válik
<pre class="prettyprint notranslate lang-py" translate="no"><code>
print("hello world")
</code></pre>
Az elismert nyelvek listája a Prettify dokumentációjában található.
A Markdownon keresztül készített összes kódblokkra a prettyprint osztály kerül alkalmazásra, kivéve, ha kifejezetten a None-ra állítja a nyelvet. További osztályokat adhat hozzá a kódblokkhoz egyéni attribútumok használatával:
The program completed successfully.
válik
<pre class="devsite-disable-click-to-copy"><code>The program completed successfully.
</code></pre>