Webleb - HTML UI Elements -

Apri nell'Editor Pubblica il Tuo Codice

Consigliato

16 April 2025

<!DOCTYPE html>
<html>
<head>
    <title>Love Confirmation</title>
    <style>
        body {
            background-color:black;
            color: white;
            font-family: Arial, sans-serif;
            text-align: center;
        }
        
        h1 {
            margin-top: 200px;
        }
        
        button {
            margin-top: 50px;
            padding: 10px 20px;
            font-size: 18px;
            background-color: white;
            color: black;
            border: none;
            cursor: pointer;
        }
        
        #no-button {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            animation: moveButton 1s infinite;
        }
        
        @keyframes moveButton {
            0% {
                top: 50%;
                left: 50%;
            }
            25% {
                top: 30%;
                left: 70%;
            }
            50% {
                top: 70%;
                left: 30%;
            }
            75% {
                top: 70%;
                left: 70%;
            }
            100% {
                top: 50%;
                left: 50%;
            }
        }
    </style>
</head>
<body>
    <h1>Do you love Huzaifa Taif Khan?</h1>
    <button id="yes-button" onclick="showThanks()">Yes</button>
    <button id="no-button">No</button>

Consigliato

Un codice di Metehan

Effetto testo a fette

HTML

CSS

JS

Consigliato

Un codice di Metehan

Effetto testo a fette

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS