Skip to content

Commit 67f1017

Browse files
authored
Update language-highlight.md
1 parent f771102 commit 67f1017

File tree

1 file changed

+61
-6
lines changed

1 file changed

+61
-6
lines changed

language-highlight.md

+61-6
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,66 @@
1-
# Resaltar Lenguajes
1+
# Resaltado de lenguaje
22

3-
**docsify** usa [Prism](https://github.com/PrismJS/prism) para resaltar bloques de código en sus páginas. Por defecto, solo es compatible con CSS, JavaScript y HTML. Puede hacer que **Prism** cargue lenguajes adicionales:
3+
Docsify utiliza [Prism](https://prismjs.com) para resaltar bloques de código en tus páginas. Prism admite los siguientes lenguajes de forma predeterminada:
4+
5+
- Marcado - `markup`, `html`, `xml`, `svg`, `mathml`, `ssml`, `atom`, `rss`
6+
- CSS - `css`
7+
- Tipo C - `clike`
8+
- JavaScript - `javascript`, `js`
9+
10+
El soporte para [idiomas adicionales](https://prismjs.com/#supported-languages) está disponible cargando los archivos de gramática específicos del idioma [via CDN](https://cdn.jsdelivr.net/npm/prismjs@1/components/):
11+
12+
```html
13+
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-bash.min.js"></script>
14+
<script src="//cdn.jsdelivr.net/npm/prismjs@1/components/prism-php.min.js"></script>
15+
```
16+
17+
!> Esta etiqueta `<script>` debe colocarse después de la etiqueta `<script>` de Docsify para que funcione.
18+
19+
Para habilitar el resaltado de sintaxis, envuelve cada bloque de código en triple comilla invertida con el [lenguaje](https://prismjs.com/#supported-languages) especificado en la primera línea:
20+
21+
````
22+
```html
23+
<p>Este es un párrafo</p>
24+
<a href="//docsify.js.org/">Docsify</a>
25+
```
26+
27+
```bash
28+
echo "hola"
29+
```
30+
31+
```php
32+
function getAdder(int $x): int
33+
{
34+
return 123;
35+
}
36+
```
37+
````
38+
39+
El markdown anterior se representará como:
440

541
```html
6-
<script src="//unpkg.com/docsify/lib/docsify.min.js"></script>
7-
<script src="//unpkg.com/prismjs/components/prism-bash.min.js"></script>
8-
<script src="//unpkg.com/prismjs/components/prism-php.min.js"></script>
42+
<p>Este es un párrafo</p>
43+
<a href="//docsify.js.org/">Docsify</a>
44+
```
45+
46+
```bash
47+
echo "hola"
948
```
1049

11-
?> Verifique la lista de [archivos de componentes](https://github.com/PrismJS/prism/tree/gh-pages/components) para más opciones.
50+
```php
51+
function getAdder(int $x): int
52+
{
53+
return 123;
54+
}
55+
```
56+
57+
## Resaltado de contenido dinámico
58+
59+
Los bloques de código [creados dinámicamente desde JavaScript](https://docsify.js.org/#/configuration?id=executescript) se pueden resaltar utilizando el método `Prism.highlightElement` de la siguiente manera:
60+
61+
```javascript
62+
const code = document.createElement('code');
63+
code.innerHTML = "console.log('¡Hola, mundo!')";
64+
code.setAttribute('class', 'lang-javascript');
65+
Prism.highlightElement(code);
66+
```

0 commit comments

Comments
 (0)