You are on page 1of 2

<!

DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta charset="utf-8">
<title>Misterele astrologiei</title>
<meta name="description" content="description"/>
<meta name="author" content="author" />
<meta name="keywords" content="keywords" />
<link rel="stylesheet" href="./stylesheet.css" type="text/css" />
<style type="text/css">.body { width: auto; }</style>
</head>
<body>
<header>
<div class="dreptunghi">
<h1>Astrologie și Zodiac</h1>
</div>
<nav>
<ul>
<li><a href="#">Acasă</a></li>
<li><a href="#">Despre</a></li>
<li><a href="#">Horoscop</a></li>
<li><a href="#">Semnele Zodiacale</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
</header>
<main>
<h2>Bine ați venit pe site-ul nostru!</h2>
<p>Aflați totul despre astrologie și semnele zodiacale aici. De la
horoscopul zilnic până la semnificațiile fiecărui semn zodiacal, avem totul
acoperit.</p>
<img src="https://www.astrolog.org/astrolog/screen/sphere.gif"
alt="Astrologie și Zodiac">
<h2>Ce este astrologia?</h2>
<p>Astrologia este studiul mișcărilor și pozițiilor relative ale
obiectelor cerești ca mijloc de divinare a informațiilor despre o persoană și
despre viața sa.</p>
<h2>Soarele în astrologie</h2>
<p>Soarele este unul dintre cele mai importante elemente din astrologie.
El simbolizează forța vitală, puterea și energia creativă, fiind asociat cu ego-ul
și identitatea personală. În funcție de poziția sa în momentul nașterii unei
persoane, se poate interpreta într-un mod unic modul în care persoana respectivă
își exprimă și își trăiește aceste caracteristici.</p>
</main>
</body>
</html>
body {
background-color: #f2f2f2;
font-family: Arial, sans-serif;
font-size: 16px;
line-height: 1.5;
margin: 0;
padding: 0;
}

header {
background-color: #4c4c4c;
color: #fff;
padding: 20px;
text-align: center;
}

h1 {
font-size: 36px;
margin: 0;
}

nav ul {
list-style: none;
margin: 0;
padding: 0;
}

nav li {
display: inline-block;
margin-right: 20px;
}

nav li:last-child {
margin-right: 0;
}

nav a {
color: #fff;
text-decoration: none;
}

main {
margin: 20px;
}

img {
max-width: 100%;
height: auto;
}

h2 {
font-size: 24px;
margin-top: 40px;
}

p {
margin-top: 20px;
}
.dreptunghi{
width: 300px;
height: 200px;
background-color: #563cc9;
border: 1px solid black;
padding: 10px;
}

You might also like