h3lp/learning
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

Add web design files

Browse Source
This commit is contained in:
h3lp
2025-11-20 21:37:53 +02:00
parent 258f24570a
commit 9192716bfb
510 changed files with 12551 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

BIN
web-design/Занятие_18/11.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 298 KiB

159
web-design/Занятие_18/18.css Normal file
View File

@@ -0,0 +1,159 @@
@charset "utf-8";
/* CSS Document */
.FL{float: left;}
.FR{float: right;}
.CB{clear: both;}
.container{
width: 765px;
height: 800px;
margin: auto;
}
.top{
margin-bottom: 15px;
width: 765px;
height: 249px;
}
.top_left{
width: 260px;
height: 249px;
background-image: url(images/img1.gif);
}
.clover{
color: white;
font-family: Arial;
letter-spacing: -1px;
font-size: 20px;
margin-top: 106px;
margin-left: 30px;
margin-right: 5px;
margin-bottom: 0px;
}
.templates{
color: white;
font-family: Arial;
font-size: 10px;
font-weight: bold;
margin-top: 0;
margin-left: 30px;
}
.leaf{
margin-top: 90px;
}
.top_right{
width: 505px;
height: 249px;
background-image: url(images/img2.gif);
}
.adv{
margin-top: 51px;
margin-left: 4px;
}
.menu{
list-style: none;
margin-right: 26px;
margin-top: 30px;
margin-bottom: 0;
}
.menu li{
display: inline;
font-size: 9px;
font-family: Arial;
margin-left: 8px;
padding-left: 12px;
}
.menu_border{border-left: 2px dashed #0D6DFF;}
.menu li a{
text-decoration: none;
color: #0D6DFF;
font-weight: bold;
}
.content{
width: 765px;
height: 351px;
}
.text{
color: #797979;
font-family: Arial;
font-size: 12px;
}
.image_text{
color: white;
font-family: Arial;
font-weight: 600;
font-size: 13px;
padding-left: 20px;
padding-top: 14px;
letter-spacing: -1px;
}
.content_left{
width: 223px;
margin-left: 20px;
height: 351px;
}
.left_image{
background-image: url(images/img5.gif);
width: 223px;
height: 44px;
}
.left_list{width: 170px;}
.left_list li{
margin: 0;
padding: 0;
color: #666;
}
.link{
color: black;
font-family: Arial;
font-size: 12px;
}
.content_right{
width: 503px;
height: 351px;
}
.otstup{padding-top: 15px;}
.text_on_right_from_image{
width: 320px;
margin-right: 40px;
line-height: 20px;
}
.right_image{
background-image: url(images/img6.gif);
width: 503px;
height: 44px;
}
.right_list{
width: 170px;
}
.right_list li{
margin: 0;
padding: 0;
color: #666;
}
.right_list li p{
margin: 0;
padding: 0;
}
.bottom{
width: 765px;
height: 59px;
background-image:url(images/img7.gif)
}
.copy{
color: white;
font-size: 11px;
font-family: Arial;
text-align: center;
padding-top: 17px;
}
.bottom_link{
color: white;
}
.last{
text-align: center;
font-family: Arial;
font-size: 11px;
}
.last a{
color: black;
}

60
web-design/Занятие_18/18.html Normal file
View File

@@ -0,0 +1,60 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="18.css" rel="stylesheet" type="text/css">
<title>Документ без названия</title>
</head>
<body>
<div class="container">
<div class="top">
<div class="top_left FL">
<div class="FL">
<h2 class="clover">CLOVER LEAF</h2>
<p class="templates">BY FREE CSS TEMPLATES</p>
</div>
<img class="leaf" src="images/img3.gif" width="44" height="47" /> </div>
<div class="top_right FR">
<ul class="menu FR">
<li><a href="#">ABOUT US</a></li>
<li class="menu_border"><a href="#">PRODUCTS</a></li>
<li class="menu_border"><a href="#">SERVICES</a></li>
<li class="menu_border"><a href="#">CLIENTS</a></li>
<li class="menu_border"><a href="#">SUPPORT</a></li>
</ul>
<img class="adv" src="images/ad468x60.jpg" width="468" height="60" />
</div>
</div>
<div class="content">
<div class="content_left FL">
<div class="left_image">
<p class="image_text">LOREM IPSUM DOLOR</p>
</div>
<ul class="left_list">
<li><p class="text">In posuere eleifend odio quisque semper augue mattis wisi. <a class="link" href="#">Maecenas ligula...</a></p></li>
<li><p class="text">Donec leo, vivamus fermentum nibh in augue praesent a lacus at. <a class="link" href="#">Urna congue rutrum...</a></p></li>
<li><p class="text">Quisque dictum integer nisl risus, sagittis convallis, rutrum id. <a href="#" class="link">Congue and nibh...</a></p></li>
</ul>
</div>
<div class="content_right FR">
<div class="right_image">
<p class="image_text">WELCOME TO CLOVER LEAF</p>
</div>
<img class="FL" src="images/img8.jpg" width="122" height="123" />
<p class="text FR text_on_right_from_image"><strong>Clover Leaf</strong> is a <a href="#" class="link">Free CSS Templates</a> released under a <a href="#" class="link">Creative Commons Attribution 2.5 License.</a>. The photo is from <a href="#" class="link">PDPhoto.org</a>. You're free to use it for both commercial or personal use. I only ask that you link back to my site in some way. Enjoy :)</p>
<p class="text CB otstup">An unordered list example:</p>
<ul class="right_list">
<li><p class="text">List item number one</p></li>
<li><p class="text">List item number two</p></li>
<li><p class="text">List item number three</p></li>
</ul>
</div>
</div>
<div class="bottom">
<p class="copy">Copyright &copy; 2007 Clover Leaf. All Right Reserved. Designed by <a href="#" class="bottom_link">Free CSS Templates</a>.</p>
</div>
<p class="last"><a href="#">Privacy Policy</a> | <a href="#">Terms of Use</a></p>
</div>
</body>
</html>

BIN
web-design/Занятие_18/images/ad468x60.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 17 KiB

BIN
web-design/Занятие_18/images/img1.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

BIN
web-design/Занятие_18/images/img2.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
web-design/Занятие_18/images/img3.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
web-design/Занятие_18/images/img4.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 44 B

BIN
web-design/Занятие_18/images/img5.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

BIN
web-design/Занятие_18/images/img6.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
web-design/Занятие_18/images/img7.gif Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
web-design/Занятие_18/images/img8.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 12 KiB