CSS Project 1 – Complete HTML and CSS code

CSS

0 Comments

Here's the complete HTML and CSS code for CSS Project 1 (styling buttons).

Result

Code

<!doctype html>
<html>
<head>
    <meta charset="UTF-8">

    <title>Project 1 - Styling Buttons</title>

    <style>
        .btn {
            margin-right: 10px;
            padding: 8px 15px;

            color: white;
            background-color: #3498db;

            font-weight: bold;
            font-family: Arial, sans-serif;
            font-size: 14px;

            border: none;
            border-radius: 5px;
        }

        .btn:hover {
            background-color: #3cb0fd;
            cursor: pointer;
        }

        .btn.gray {
            background-color: #737373;
        }

        .btn.gray:hover {
            background-color: #8c8c8c;
        }
    </style>
</head>

<body>

    <input type="button" class="btn" value="Button 1">
    <input type="button" class="btn gray" value="Button 2">

</body>
</html>

Practice in Editor

Leave a Comment