Blaze UI Tipografía Hipervínculos

Blaze UI es una biblioteca de interfaz de usuario basada en CSS de código abierto que proporciona una excelente estructura para crear sitios web rápidamente con una base escalable y fácil de mantener.

En este artículo, aprenderemos sobre los hipervínculos de la tipografía de la interfaz de usuario de Blazer. Tipografía de la interfaz de usuario de Blazer Los hipervínculos se utilizan para proporcionar cierto estilo a los hipervínculos, es decir, proporcionar diferentes colores a los enlaces.

Blazer UI Tipografía Hipervínculos Clases:

  • c-link: esta es una clase predeterminada, que proporciona color azul a los hipervínculos.
  • c-link–brand: Esta clase proporciona color negro a los hipervínculos.
  • c-link–info: esta clase proporciona color azul a los hipervínculos.
  • c-link–warning: esta clase proporciona color amarillo a los hipervínculos.
  • c-link–error: esta clase proporciona color rojo a los hipervínculos.
  • c-link–success: Esta clase proporciona color verde a los hipervínculos.

Sintaxis:

<a href="#" class="c-link c-link--brand">....</a>

Nota: Use la sintaxis anterior reemplazando las clases mencionadas anteriormente según sea necesario.

Ejemplo 1: En este ejemplo, aprenderemos sobre las clases c-link , c-link–brand y c-link–warning .

HTML

<html>
  
<head>
    <link rel="stylesheet" href=
"https://unpkg.com/@blaze/css@x.x.x/dist/blaze/blaze.css">
</head>
  
<body>
    <h1 style="color:green">GeeksforGeeks</h1>
    <h3> Blaze UI Typography Hyperlinks</h3>
    <a href="#" class="c-link">I am c-link</a><br />
    <a href="#" class="c-link c-link--brand">I am brand</a><br />
    <a href="#" class="c-link c-link--warning">I am warning</a><br />
</body>
</html>

Producción:

 

Ejemplo 2: En este ejemplo, aprenderemos sobre las clases c-link–info , c-link–error y c-link–success .

HTML

<html>
  
<head>
    <link rel="stylesheet" href=
  "https://unpkg.com/@blaze/css@x.x.x/dist/blaze/blaze.css">
</head>
  
<body>
    <h1 style="color:green">GeeksforGeeks</h1>
    <h3> Blaze UI Typography Hyperlinks</h3>
    <a href="#" class="c-link c-link--info">I am Info</a><br />
    <a href="#" class="c-link c-link--success">I am Success</a><br />
    <a href="#" class="c-link c-link--error">I am Error</a><br />
</body>
</html>

Producción:            

 

Referencia: https://www.blazeui.com/components/typography

Publicación traducida automáticamente

Artículo escrito por nikitamehrotra99 y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *