Верстка сайта из готового дизайн макета

Автор работы: Пользователь скрыл имя, 06 Февраля 2011 в 14:23, курсовая работа

Описание работы

Сайт - это информационная и рекламная единица, доступная практически из любой точки планеты, это десятки или сотни веб-страниц, связанных между собой общей темой, дизайном, ссылками. Главное назначение любого сайта – это удобное предоставление, какой либо информации неважно, что это за сайт. Будь это сайт, какой ни будь трансконтинентальной корпорации или какой ни будь блог обычного человека, главная цель этих сайтов это предоставление какой либо полезной информации посетителям данного сайта.

Скачать архив (43.75 Кб) Сколько стоит заказать работу?

Файлы: 1 файл

Курсовая.doc

— 175.00 Кб (Скачать файл)

<div align="center"><b>March 27, 2003</b><br><span class="text"><img src="image/13.jpg" width="51" height="44" align="left" longdesc="image/13.jpg" />Lorem ipsum dolor sit met, consectetuer adipising elit. Praesent vestibulurn lestie lacus. Aenean

</span></div>

<div align="center"><b>March 27, 2003</b><br><span class="text"><img src="image/14.jpg" width="51" height="44" align="left" longdesc="image/14.jpg" />Lorem ipsum dolor sit met, consectetuer adipising elit. Praesent vestibulurn lestie lacus. Aenean

</span></div>

<div align="center"><b>March 27, 2003</b><br><span class="text"><img src="image/15.jpg" width="51" height="44" align="left" longdesc="image/15.jpg" />Lorem ipsum dolor sit met, consectetuer adipising elit. Praesent

</span></div>

</div>

</div>

</body>

</html>

Листинг файла Index2.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>Шаблон сайта</title>

</head>

<body>

<a href="Index.html">Главная</a> | Карта сайта | Контакты </div>

<div class="centr2"><span class="yellowtext">:: Cпециальное предложение</span>

<div class="text"><img src="image/17.jpg" width="114" height="141" longdesc="image/17.jpg" align="left" hspace="5" />Lorern ipsurn dolor sirnet, consectetuer adipisc elit. Praesent vestibu- lurnrnolestie lacus. Aeneannonurnrny hendrerit rnauris. Phsellus porta. Fussuscipit varius rni. Nulla dui. Fusee feugiat rnalesuada odio. odio, gravida at, cursus nec, luctus a, lorem.<br><br>

ecenas tristique orci ac sern. Duis ultricies pharetra magna. Doneurn- san esuada orci. Donee sit arnet eros. Mauris ferrnenturn dictum magna. Sed oreet aliquarn leo. Ut tellus dolor, dapibus eget, elernenturn vel, cursueleif- end, elit. Aenean auctor

<b>• Lorem ipsum dolor sit amt, contuent vum molestie lacus. Aenean nonummy hendrerit

• Lorem ipsum dolor sit amt, contuent vum molestie lacus. Aenean nonummy hendrerit

</b></p></td>

<td width="248"><img src="image/18.jpg" width="1" height="150" hspace="5" longdesc="image/18.jpg" align="left"/><img src="image/19.jpg" width="104" height="146" longdesc="image/19.jpg" align="right"/><span class="text">Lorern ipsurn dolor sirnet, consectetuer adipisc elit. Praesent vestibu- lurnrnolestie lacus. Aeneannonurnrny hendrerit rnauris. Phsellus porta. Fussuscipit varius rni. Nulla dui. Fusee feugiat </span></td>

</tr></table></div>

<div class="centr2"> <span class="yellowtext">:: Section Header</span> <br />

<span class="text"> <img src="image/20.jpg" width="126" height="117" longdesc="image/20.jpg" align="left" />Lorern ipsurn dolor sirnet, consectetuer adipisc elit. Praesent vestibu- lurnrnolestie lacus. Aeneannonurnrny hendrerit rnauris. Fusee feugiat rnalesuada odio. orbi nunc odio, gravida at, cursus .<br /><br />

ecenas tristique orci ac sern. Duis ultricies pharetra magna.Doneurn san esuada orci. Donee sit arnet eros.</span><br /><br />

<li type="disc"><strong>  Company</strong></li>

<li type="disc"><strong>  Products</strong></li>

<li type="disc"><strong>  Services</strong></li>

<li type="disc"><strong>  Support </strong></li>

<li type="disc"><strong>  Articles</strong></li>

<li type="disc"><strong>  Makeup </strong></li>

<li type="disc"><strong>  Contact</strong></li></ul></div>

<div class="yellowtext">:: Company News</div>

</span></div>

</div>

</div>

</body>

</html>

Листинг файла twoColLiqRt.css

@charset "utf-8";

.main {background: #ffffff;

width: 737px;

height: auto;

margin: auto;

bottom: 100px; }

ul, ol, dl {padding: 0;

margin: 0;

line-height: 18pt; }

h1, h2, h3, h4, h5, h6, p {margin-top: 0; }

a img { border: none; }

a:link {color:#414958;

text-decoration: none; }

a:visited {color: #4E5869;

text-decoration: none;}

a:hover, a:active, a:focus {text-decoration: none; }

.container { margin: 0 auto

font-family: "Lucida Console", Monaco, monospace;

font-size: 12px;

height: 15px;

padding-top: 3px;

padding-left: 6px; }

.sidebar1 {float: right;

width: 30%;

background: #93A5C4;

padding-bottom: 10px; }

.content {width: 385pt;

float: left;

height: 537px;}

.welcome{background:url(image/5.jpg);

height: 167px;

width: auto;

text-align: center;

font-size: 12px;

padding-right: 15px;

padding-left: 140px;

padding-top: 15px; }

.leftc {background-image:url(image/6.jpg);

height: 165px;

width: 232px;

padding-left: 25px;

padding-top: 9px;

float: left; }

.rightc {background-image: url(image/7.jpg);

width: 230px;

height: 160px;

float: right;

padding-left: 25px;

padding-top: 10px; }

.text {font-size:12px;

text-align:left;

color: #000;

font-family: "Comic Sans MS", cursive; }

.zag {font-size:16px;

text-align:center;

color:#06C;

font-family: "Comic Sans MS", cursive; }

.yellowtext{color:#FC0;

font-family: Tahoma, Geneva, sans-serif;

font-size: 15px;

font-weight: bold; }

.ctext{float: right;

width: 150px;

height: 140px; }

.niz{height: 135pt;

width: 377pt;

float: left;

padding-left: 5px; }

.niz2 {height:152px;

width: 154px;

float: left;

padding-left: 8px;

padding-right: 5px;

padding-top: 10px; }

.polosa {height: 9px;

width: 100%;

float: left;}

.right{background:url(image/11.jpg);

height: 199px;

width: 159px;

float: right;

padding-left: 60px;

color: #FFF;

padding-top: 10px;

background-repeat: repeat-y; }

.rightn{height: 330px;

float: right;

width: 179px;

padding-left: 30px;

background-repeat: repeat-y;

padding-right: 10px; }

.centr2{float: left;

width: 497px;

height: 170px;

background-repeat: repeat-y;

padding-left: 10px;

padding-right: 10px;

padding-top: 10px; }

.content ul, .content ol { padding: 0 15px 15px 40px; }

ul.nav {list-style: none;

border-top: 1px solid #666;

margin-bottom: 15px; }

ul.nav li {border-bottom: 1px solid #666; }

ul.nav a, ul.nav a:visited {padding: 5px 5px 5px 15px;

display: block;

text-decoration: none;

background: #8090AB;

color: #000;}

ul.nav a:hover, ul.nav a:active, ul.nav a:focus {background: #6F7D94;

color: #FFF;}

.clearfloat {clear:both;

font-size: 1px;}

.main .content .welcome p {font-family: Comic Sans MS, cursive;}

.main .content .welcome pre {font-family: Comic Sans MS, cursive;}

.welcome {font-family: Comic Sans MS, cursive;font-size: 16px;}

Информация о работе Верстка сайта из готового дизайн макета