New Text Document

https://www.svgrepo.
com/
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Биография</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<section>
<header>
<div>
<img src="Lebron James.jpg">
<h1>Леброн<br>Джеймс</h1>
<p>Баскетболист</p>
<br>
<content>
<p>
Леброн Джеймс е роден на 30 декември 1984 в Акрън, Охайо.
От ранните си години в гимназията той привлича вниманието на
баскетболните скаути, които му предричат голямо бъдеще.
Паралелно с баскетбола, младият Леброн тренира и американски
футбол.
</p>
<p>
Най-успешният сезон за Леброн в НБА е през 2006 – 2007 г. с екипа
на Кавалиърс.
Той успява да изведе отбора си до първи финал в НБА, загубен обаче
катастрофално от Сан Антонио Спърс с 4:0.
На 8 юли 2010 г. подписва официално с отбора на Маями Хийт. През
2012 г. и през 2013 г. е с основен принос за втората
и третата шампионска титла на отбора.
</p>
<p>
Леброн Джеймс е определян от много хора като лицето на НБА, а
мнението му има голямо влияние върху много ключови решения,
взимани в лигата. Извън терена той се представя не по-зле,
отколкото на него, и сключва договори с
едни от най-известните брандове в света. Договорите му с гиганти,
като Кока Кола, Макдоналдс, Найк и Самсунг,
го превръщат в най-добре печелещия играч в НБА с доход от 72
милиона долара само за 2014 г.
</p>
</content>
</div>
<aside>
<h2 class="profile">Контакти</h2>
<ul>
<li class="address">
<img src="flag-svgrepo-com.svg" alt="">
<span>бул. Oxford Rd, 36
<br> ОН Охайо, Америка<br><br>
</span>
</li>
<li class="phone">
<img src="phone-call-telephone-svgrepo-com.svg" alt="">
<span>тел: +359 887 123 456</span>
</li>
<li class="email">
<img src="help-information-question-svgrepo-com.svg" alt="">
<span>email: lebronJames.gmail</span>
</li>
</ul>
</aside>
</header>
</section>
<nav>
<ul>
<li><a href="file:///C:/Users/%D0%96%D0%B8%D0%B2%D0%BA%D0%BE
%D0%A1%D0%96%D0%B5%D0%BB%D0%B5%D0%B2/OneDrive%20-%20%D0%9C%D0%B8%D0%BD
%D0%B8%D1%81%D1%82%D0%B5%D1%80%D1%81%D1%82%D0%B2%D0%BE%20%D0%BD%D0%B0%20%D0%BE
%D0%B1%D1%80%D0%B0%D0%B7%D0%BE%D0%B2%D0%B0%D0%BD%D0%B8%D0%B5%D1%82%D0%BE
%20%D0%B8%20%D0%BD%D0%B0%D1%83%D0%BA%D0%B0%D1%82%D0%B0/Documents/index.html/
index.html">Начало</a></li>
<li><a href="https://www.bing.com/images/search?q=%d0%bb
%d0%b5%d0%b1%d1%80%d0%be%d0%bd+%d0%b4%d0%b6%d0%b5%d0%b9%d0%bc
%d1%81&form=HDRSC3&first=1&tsc=ImageHoverTitle">Галерия</a></li>
<li><a href="https://www.bing.com/videos/search?q=%d0%bb
%d0%b5%d0%b1%d1%80%d0%be%d0%bd+%d0%b4%d0%b6%d0%b5%d0%b9%d0%bc
%d1%81&FORM=HDRSC4">Видеа</a></li>
<li><a href="https://bg.wikipedia.org/wiki/%D0%9B
%D0%B5%D0%B1%D1%80%D0%BE%D0%BD_%D0%94%D0%B6%D0%B5%D0%B9%D0%BC%D1%81">Уикипедия</
a></li>
</ul>
</nav>
<footer>
<div class="autor">
Създадена на
<script> document.write(new Date().toLocaleDateString());
</script>
<br>
от Живко.
<p class="copyright">© 2022 Всички права запазени</p>
</div>
<div class="links">
<ul>
<li>
<a href="https://google.com"><img src="google.jfif"
alt=""></a>
</li>
<li>
<a href="https://facebook.com"><img src="facebook.jfif"
alt=""></a>
</li>
<li>
<a href="https://instagram.com"><img src="instagram.jfif"
alt=""></a>
</li>
<li>
<a href="https://twitter.com"><img src="twitter.jfif"
alt=""></a>
</li>
</ul>
</div>
</footer>
</body>
</html>
style.css
* {
padding: 0;
margin: 0;
outline: 0;
}
body {
font-family: Arial;
font-size: 14px;
}
section {
padding: 50px 300px 0 150px;
margin: 0 5%;
}
h2 {
position: relative;
padding-left: 50px;
margin-bottom: 20px;
}
h2:before {
position: absolutive;
content: '';
left: 10px;
top: 20px;
width: 0px;
height: 0px;
border-top-width: 9px;
border-right-width: 9px;
box-shadow: 2px 2px 0 2px white;
transform: scale(0.5) rotate(45deg);
}
h2:after {
position: absolute;
content: '';
left: 0px;
top: 0px;
width: 45px;
height: 45px;
border-radius: 23px;
box-shadow: 0 -3px 0px 1px white;
background: url('person-svgrepo-com.svg') no-repeat 0px 0px /350px;
background-size: contain;
header {
white-space: nowrap;
}
header div, header aside {

display: inline-block;
width: 100%;
box-sizing: border-box;
vertical-align: top;
white-space: normal;
}
header div img {

float: left;
width: 110px;
margin: -10px 0 0 -130px;
border-radius: 55px;
}
header div h1 {
margin: -10px 0 10px;
padding-top: -20px;
font-size: 40px;
font-weight: normal;
overflow: hidden;
text-overflow: ellipsis;
}
header div p {
color:#00aaff;
overflow: hidden;
text-overflow: ellipsis;
font-size: 20px;
}
header div content p {

background: white;
color: #999999;
}
header aside {
width: 280px;
margin: 0 -280px 0 20px;
}
head aside h2 {
}
header aside ul {
list-style: none;
color: #999999;
}
header aside ul li {
position: relative;
padding-left: 5px;
line-height: 25px;
}
header aside ul li img {
width: 20px;
}
.email img {
margin-top: 10px;
}
.email span {
margin-left: 6px;
}
nav {
margin: 10px 300px 10 150px;
margin: 0 17%;
background: white;
}
nav ul {
list-style: none;
}
nav ul li {
margin: 20px 4%;
}
nav ul li a {
text-decoration: none;
display: block;
background: #00aaff;
padding: 2px 3px;
color: white;
border-radius: 7px;
}
nav ul li a:hover {
background: #05405e;
}
footer {
margin: 10px 30px;
padding-top: 10px;
border-top: thin dotted;
width: 75%;
font-size: 12px;
color: #999999;
}
.autor {
float: left;
margin-left: 50px;
width: 200px;
}
.links {
float: right;
width: 250px;
}
.links ul li {
list-style: none;
margin: 10px 2%;
}
.links ul li img {
width: 30px;
}
.links li a:hover {
padding-inline: 1px;
background: rgb(224,224,224);
}

New Text Document

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

New Text Document

Uploaded by

Copyright:

Available Formats

https://www.svgrepo.

header div, header aside {

header div img {

header div content p {

You might also like