HTML CSS OTP फॉर्म

1718 MyPortfolio

संपादक में खोलें अपना कोड प्रकाशित करें

अनुशंसित

15 October 2025

अनुमान लगाने का खेल HTML जावास्क्रिप्ट कोड

19 October 2024

एनिमेटेड HTML लॉगिन फ़ॉर्म

5 August 2025

कंपनी कार्ड सूची: HTML और CSS उदाहरण

HTML

CSS

* {
            box-sizing: border-box;
            margin: 0;
            padding: 0;
            font-family: Arial, sans-serif;
        }

/* Body Styling */
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            background-color: #f0f4f8;
        }

/* Container Styling */
        .otp-container {
            background: #ffffff;
            padding: 2rem;
            border-radius: 8px;
            box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
            text-align: center;
            width: 400px;
        }

/* Heading Styling */
        .otp-container h2 {
            color: #333;
            font-size: 1.5rem;
            margin-bottom: 1rem;
        }

/* OTP Input Styling */
        .otp-input {
            display: flex;
            justify-content: space-between;
            gap: 8px;
            margin: 1rem 0;
        }

.otp-input input[type="text"] {
            width: 40px;
            height: 50px;
            font-size: 1.5rem;
            text-align: center;
            border: 2px solid #ddd;
            border-radius: 6px;
            transition: border-color 0.3s;
        }

.otp-input input[type="text"]:focus {
            border-color: #007bff;
            outline: none;
        }

/* Submit Button Styling */
        .submit-btn {
            background-color: #007bff;
            color: #ffffff;
            font-size: 1rem;
            padding: 0.7rem 1.5rem;
            border: none;
            border-radius: 5px;
            cursor: pointer;
            transition: background-color 0.3s;
        }

.submit-btn:hover {
            background-color: #0056b3;
        }

/* Instruction Text */
        .instruction {
            color: #666;
            font-size: 0.9rem;
        }

अनुशंसित

अनुमान लगाने का खेल HTML जावास्क्रिप्ट कोड

एनिमेटेड HTML लॉगिन फ़ॉर्म

कंपनी कार्ड सूची: HTML और CSS उदाहरण

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS