Scribd Logo
Upload

Welcome to Scribd!

  • 6 views

    Css Form

    Uploaded by

    Turut Minang
    This document contains CSS code that defines styles for a form container, form elements like inputs and labels, and a submit button. It sets styles like fonts, colors, padding, borders and includes animation for the form elements to fade in. The CSS is organized into sections for the body, form container, form headings, inputs, submit button and keyframe animation.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content

    You might also like

    Css Form

    Uploaded by

    Turut Minang
    6 views2 pages
    This document contains CSS code that defines styles for a form container, form elements like inputs and labels, and a submit button. It sets styles like fonts, colors, padding, borders and includes animation for the form elements to fade in. The CSS is organized into sections for the body, form container, form headings, inputs, submit button and keyframe animation.

    Original Description:

    Original Title

    CssForm

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    This document contains CSS code that defines styles for a form container, form elements like inputs and labels, and a submit button. It sets styles like fonts, colors, padding, borders and includes animation for the form elements to fade in. The CSS is organized into sections for the body, form container, form headings, inputs, submit button and keyframe animation.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    6 views2 pages

    Css Form

    Uploaded by

    Turut Minang
    This document contains CSS code that defines styles for a form container, form elements like inputs and labels, and a submit button. It sets styles like fonts, colors, padding, borders and includes animation for the form elements to fade in. The CSS is organized into sections for the body, form container, form headings, inputs, submit button and keyframe animation.

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 2

    1 body {

    2 font-family: 'Arial', sans-serif;


    3 background: url('BACKGROUND.png') center center fixed;
    4 background-size: cover;
    5 margin: 0;
    6 padding: 0;
    7 display: flex;
    8 justify-content: center;
    9 align-items: center;
    10 height: 100vh;
    11 }
    12
    13 .form-container {
    14 background-color: rgba(207, 234, 245, 0.861);
    15 border-radius: 8px;
    16 padding: 20px;
    17 box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    18 width: 400px;
    19 text-align: center;
    20 }
    21
    22 .form-container h2 {
    23 color: #333;
    24 margin-bottom: 20px;
    25 }
    26
    27 .logo {
    28 margin-bottom: 20px;
    29 }
    30
    31 .form-group {
    32 margin-bottom: 20px;
    33 }
    34
    35 label {
    36 display: block;
    37 margin-bottom: 8px;
    38 color: #555;
    39 }
    40
    41 input {
    42 width: 100%;
    43 padding: 10px;
    44 margin-top: 6px;
    45 margin-bottom: 12px;
    46 box-sizing: border-box;
    47 border: 1px solid #ccc;
    48 border-radius: 4px;
    49 transition: border-color 0.3s ease;
    50 }
    51
    52 input:focus {
    53 outline: none;
    54 border-color: #4CAF50;
    55 }
    56
    57 .error-message {
    58 color: #e74c3c;
    59 margin-top: 4px;
    60 }
    61
    62 .submit-btn {
    63 background-color: #4CAF50;
    64 color: #fff;
    65 padding: 10px 20px;
    66 border: none;
    67 border-radius: 4px;
    68 cursor: pointer;
    69 transition: background-color 0.3s ease;
    70 }
    71
    72 .submit-btn:hover {
    73 background-color: #45a049;
    74 }
    75
    76 @keyframes fadeIn {
    77 from {
    78 opacity: 0;
    79 }
    80
    81 to {
    82 opacity: 1;
    83 }
    84 }
    85
    86 .form-container,
    87 .submit-btn {
    88 animation: fadeIn 1s ease-in-out;
    89 }
    90

    You might also like