<header>
Елена Грановская- копирайтер.
</header>
<ul id="navbar">
<li><a href="menu_about_us.html"><img src="icons8-about-24.png" alt="логотип" title="логотип"><br> ПРО_НАС </a></li>
<li class="drp"><a href="texty.html" ><img src="icons8-контакты-24.png" alt="логотип" title="логотип"><br> КОНТАКТЫ </a>
<ul class="dropdown">
<a href="https://www.facebook.com/granovskaolena"><img src="icons8-facebook-24.png" alt="логотип" type="логотип">FACEBOOK</a>
<a href="http://instagram.com/granovskaolena"><img src="icons8-instagram-24(1).png" alt="логотип" type="логотип">INSTAGRAMM</a>
<a href="https://vk.com/ninevska"><img src="icons8-vk-circled-24.png" alt="логотип" type="логотип">VKONTAKTE</a>
<a href="#"><img src="icons8-whatsapp-24(1).png" alt="логотип" type="логотип">WHATSUPP</a>
<a href="#"><img src="icons8-viber-24.png" alt="логотип" type="логотип">__VIBER__</a>
<a href="#"><img src="icons8-important-mail-24.png">ЭЛЕКТРОННАЯ_ПОЧТА</a>
<a href="#"><img src="icons8-phone-24.png" alt="логотип" type="логотип">ТЕЛЕФОН</a>
</ul>
</li>
<li><a href=""><img src="icons8-us-dollar-24.png" alt="логотип" type="логотип"><br>СТОИМОСТЬ</a></li>
<li><a href="BLOG.HTML"><img src="icons8-для-тебя-24.png" alt="логотип" type="логотип"><br>МОИ_БЛОГ</a></li>
</ul>
<h1 class="marquee" align="center" ><span><BIG>KONTENTMAKER</BIG></span></h1>
html {
overflow: hidden;
position :relative; }
header {
border:4px solid green;
width:100%;
background-color:#9400D3;
color:yellow;
font-size:48px;
font-family:cursive;
text-align:center;
margine:0 auto;
position:relative;
right:0.45%;
padding:0.2% 0.2%;
}
#navbar {
width: 100%;
margin:0 -0.3%;
padding:0.3% 0.01%;
list-style-type: none;
border: 4px solid #0066FF;
border-radius: 20px 20px;
text-align: center;
font-family:serif;
background-color:#6495ED;
position:relative;
display:inline-block;
justify-content:center;
}
#navbar li {
display:inline-block;
position:relative;
width:23.5%;
border-radius:5px 20px 5px 20px;
background-color:#8A2BE2;
border:5px solid #9932CC;
}
#navbar a {
color: green;
text-decoration: none;
font-weight: bold;
border-radius:20px 5px;
border: 2px solid white;
background-color:#9ACEEB;
font-size:25px;
position:relative;
display:inline-block;
width:95%;
padding:2% 0;
margin:1% 2%;
}
.dropdown {
display: none;
}
.drp:hover .dropdown {
position: relative;
display: block;
position: absolute;
top: 92px;
left: -40px;
}
#navbar a:hover {
border-radius: 20px 5px;
background-color: #66CDAA;
}
h1 {
color:red;
}
body {
background: url("plans-to-build-a-home-picjumbo-com.jpg");
background-size:cover;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.