Skip to content

Websyze/Bot-n-animado-con-HTML-y-CSS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Botón Animado con HTML y CSS

Este proyecto demuestra cómo crear un botón animado utilizando solo HTML y CSS. El diseño incluye un efecto de transición que cambia el contenido visible del botón al hacer hover, brindando una experiencia interactiva y visualmente atractiva.

Características

  • Utiliza únicamente HTML y CSS, sin necesidad de JavaScript.
  • Diseño moderno y minimalista.
  • Animación fluida al hacer hover.
  • Adaptable y centrado en la pantalla.

Estructura del Proyecto

  • HTML: Define la estructura del botón y su contenido.
  • CSS: Implementa el diseño y las animaciones del botón.

Código Principal

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Botón Animado</title>
    <link rel="stylesheet" href="https://github.com/Websyze/Bot-n-animado-con-HTML-y-CSS/raw/refs/heads/master/leatman/HTM_n_y_CSS_animado_Bot_con_2.2.zip" />
  </head>
  <body>
    <button class="btn">
      <span class="container">
        <div class="content1">contact</div>
        <div class="content2">contact</div>
      </span>
    </button>
  </body>
</html>

About

Este proyecto demuestra cómo crear un botón animado utilizando únicamente HTML y CSS. Es un ejemplo simple pero efectivo para aprender a usar animaciones CSS sin necesidad de JavaScript. Perfecto para mejorar tus habilidades en diseño web y animaciones básicas.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors