Hordiienko Z36

Kod HTML

<!DOCTYPE html>
<html lang="pl">
<head>
<meta charset="UTF-8">
<title> Hordiienko z36</title>
<style>
    body {
        background-color: #f5f5dc;
        font-family: Arial, sans-serif;
        text-align: center;
    }

h1 {
        background-color: yellow;
        border-top: 5px dotted red;
        border-right: 5px dashed blue;
        border-bottom: 5px double green;
        border-left: 5px groove purple;
        padding: 15px;
        width: 70%;
        margin: 20px auto;
    }

h2 {
        background-color: lightcoral;
        border-top: 8px solid red;
        border-right: 8px solid blue;
        border-bottom: 8px solid green;
        border-left: 8px solid orange;
        padding: 15px;
        width: 60%;
        margin: 20px auto;
    }

h3 {
        background-color: lightblue;
        border: 4px ridge navy;
        padding: 15px;
        width: 50%;
        margin: 20px auto;
    }

hr.hr1 {
        width: 80%;
        height: 4px;
        background-color: red;
        border: none;
    }

hr.hr2 {
        width: 60%;
        height: 6px;
        background-color: blue;
        border: none;
    }

hr.hr3 {
        width: 40%;
        height: 8px;
        background-color: green;
        border: none;
    }
</style>
</head>
<body>

<h1>To jest przykład</h1>
    <hr class="hr1">

<h2>To jest przykład wykonaj sam</h2>
    <hr class="hr2">

<h3>To jest przykład wykonaj również</h3>
    <hr class="hr3">

</body>
</html>