Trazo CSS de viento de cola

Esta clase acepta mucho valor en Tailwind CSS en el que todas las propiedades están cubiertas en forma de clase. Es la clase de trazo que se aplicará al elemento SVG. En CSS, usamos Stroke Property .

Clases de trazo:

  • stroke-current: esta clase se usa para establecer el color del trazo de un SVG en el color del texto actual. Esto facilita la configuración del color del trazo de un elemento al combinar esta clase con una utilidad de color de texto existente.

Sintaxis :

<svg class="stroke-current">...</svg>

Ejemplo:

HTML

<!DOCTYPE html> 
<html> 
<head> 
    <link href= 
"https://unpkg.com/tailwindcss@^1.0/dist/tailwind.min.css"
        rel="stylesheet"> 
</head> 
  
<body class="text-center mx-4 space-y-2"> 
    <h1 class="text-green-600 text-5xl font-bold"> 
        GeeksforGeeks 
    </h1> 
    <b>Tailwind CSS Stroke Class</b> 
    <div class="bg-green-900 m-4 grid grid-flow-col gap-4 p-5"> 
        <svg height="150px" width="600px"
      xmlns="http://www.w3.org/2000/svg"
      version="1.1"> 
      <circle class="stroke-current text-red-600" cx="100"
        cy="70" r="50" /> 
      <circle class="stroke-current text-green-600" cx="250"
        cy="70" r="50" /> 
      <circle class="stroke-current text-blue-600" cx="400"
        cy="70" r="50" /> 
      <circle class="stroke-current text-yellow-600" cx="550"
        cy="70" r="50" /> 
    </svg> 
    </div> 
</body> 
  
</html> 

Producción:

clase de carrera

Publicación traducida automáticamente

Artículo escrito por skyridetim 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 *