Курсова работа по уеб дизайн на деан денев 29а проверил: 083268 16. 12. 2009г. (надяваме се)

КУРСОВА РАБОТА
ПО УЕБ ДИЗАЙН

НА ДЕАН ДЕНЕВ 29А Проверил:

083268

16.12.2009г. (надяваме се)

Като за начало, това е сайт. Не може да се очаква да е курсова по уеб дизайн, и да не е сайт, нали? Сайтът се състои от общо пет страници. 4 са спазили изизскването за разполагане, една- не. Това е направено с умисъл. В указанията е казано, сайтът да има поне 4 страници, и разположението на тези 4 страници да е спазено с това на задачата. Е, така е. Галерията като 5-та страница е разчупена.Идеята е да нямаме само скучно еднообразие. Нека сега обърнем по малко внимание на всяка една от страниците:

1. 
   Всяка страница трябва да си има индекса. Нашият index.html, има следната визия:
   

Като повечето индекси, и този е вид шаблон, за това ще споделим общите неща. От ляво имаме Ники, от дясно Бисер.(Това се подразбира, нали?) Та, наблегнато е на черно-белите нюанси. Самият формат на страницата, е извършен главно чрез файл, носещ името main.css, като в него главно са дефинирани: лява колона, среда, дясно колона, и т.н. хедър. (аз му казвам лого). Също така имаме дефинирани и два текстови формата- h1 и h2, използвани за форматиране на допълнителната навигация, където отдаваме почит на http://uroci.net . Ето го и самият код на css файла:
body {

font-family: Arial, Helvetica, sans-serif;

font-size: 13px;

background-image: url('strani.JPG');

}
#wrapper {

margin: 0 auto;

width: 922px;

}

#header {

color: #333;

width: 900px;

float: left;

padding: 10px;

border: 1px solid #ccc;

height: 80px;

margin: 10px 0px 0px 0px;

background-image: url('header.JPG');
}

#leftcolumn {

color: #333;

border: 1px solid #ccc;

margin: 0px 0px 0px 0px;

background-image: url('nikileft.jpg');

padding: 10px;

height: 456px;

width: 251px;

float: left;

img src="b1.jpg";

}

#content {

float: left;

color: #333;

border: 1px solid #ccc;

background: #808080 ;

margin: 0px 0px 0px 0px;

padding: 10px;

height: 456px;

width: 350px;

display: inline;

}

#rightcolumn {

color: #333;

border: 1px solid #ccc;

background-image: url('biserright.jpg');

margin: 0px 0px 0px 0px;

padding: 10px;

height: 456px;

width: 251px;

float: left;

position: relative;

}
h1 {

font-family: Verdana;

font-size: 25px;

color: #ADFF2F ;

text-align: left;

text-transform: none;

text-decoration: none;

letter-spacing: normall;

word-spacing: normall;}
h2 {

font-family: Verdana;

font-size: 15px;

color: #ADFF2F ;

text-align: left;

text-transform: none;

text-decoration: none;

letter-spacing: normall;

word-spacing: normall;
И така, смело скачаме на

2. За групата. За изготвянето на тази страница, е използван шаболнът на индекса, като единствено е сменен текстът, както и форматирането му. Бля! Нищо интересно.
3.
Искрен човек съм, за това ще си призная, че за галерията е използвана заготовка, взета от така обичания от нам сайт- http://uroci.net . Галерията изглежда така поради една единствена причина- фонът. Галактиката Андромеда. Навигацията е поставена върху една доста компроментираща снимка, на която сме Антонии, Марто, Бисер и аз. Това е другото отличително на тази страница. Галерията във своят сорс вид изглежда така:

27 А група в действие

И така 14 пъти за всяка една от снимките.  Но ще пестим мастило. Допълнително добавяме и навигацията, разбира се. ОБщият й вид е:
<div id="rightcolumn">

В случая, тя е вградена в дясната колона. Интересното е, че при FireFox, се визуализира по следния начин: Натискаш върху малката снимка, задържаш мишката, и се появява снимката. И е така, докато не отместиш мишката. При IE8, натискаш снимката, и тя се появава, независимо дали ще местиш мишката. И така, докато не натиснеш друга снимка. В случая, личното ми мнение е, че IE8 интерпретира нещата повече според моята идея. Благодаря ти Бил Гейтс. Амин. Та:
4. Видео. С нищо не се различава от индекса, със изключение на видеото- нещо пиянско от 8-ми декември 2008-ма. Уж беше пиянско де, аз не пия. Това няма значение. Извикваме Windows Media Player. Кодът е готов, извзет от фрии сървъриге на Нетуоркс, и изглежда по следния начин:

Изтегляне 58.11 Kb.

Сподели с приятели: