El elemento de código se utiliza para diseñar el código en línea y el fragmento de código.
En este artículo, aprenderemos sobre el fragmento de código. El fragmento de código es la parte del código real que contiene varias líneas de código, por lo que podemos usar <pre> con la clase de código como contenedor y agregar <code> dentro. El atributo data-lang se representa como el nombre del idioma en la parte superior derecha.
Clase de fragmento de código Spectre:
- código: esta clase se utiliza para colocar el contenido como una interfaz de codificación.
Sintaxis:
<pre class="code" >
<code>...</code>
</pre>
Ejemplo: El siguiente ejemplo ilustra el fragmento de código de Spectre.
HTML
<!DOCTYPE html> <html> <head> <title>SPECTRE CSS Code Class</title> <link rel="stylesheet" href= "https://unpkg.com/spectre.css/dist/spectre.min.css"> <link rel="stylesheet" href= "https://unpkg.com/spectre.css/dist/spectre-exp.min.css"> <link rel="stylesheet" href= "https://unpkg.com/spectre.css/dist/spectre-icons.min.css"> </head> <body> <center> <h1 class="text-success">GeeksforGeeks</h1> <strong>SPECTRE Code snippet</strong> <br><br> <pre class="code" data-lang="HTML"> <h3>Learning Web Development</h3> <code>A Computer Science portal for Geeks</code> </pre> </center> </body> </html>
Producción:
Fragmento de código Spectre
Referencia: https://picturepan2.github.io/spectre/elements/code.html#code-snippet
Publicación traducida automáticamente
Artículo escrito por skyridetim y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA