Създаване на проста уеб страница
В този раздел, ние ще илюстрираме с конкретен пример за това, как да се напише една проста уеб страница в HTML програмиране.
Първата стъпка в създаването на една проста уеб страница
Какво ще правим сега може да се нарече предварително маркиране най-простият уеб страницата. Досега нашата страница не съдържа никаква информация и ако го държи по такъв начин, че когато го отворите в прозорец на браузъра, този прозорец, ще бъде празно.
И текстът, който ние въведохме, се състои от три двойки тагове HTML-документ. Имайте предвид, че по-голямата част на HTML тагове се използват по двойки в първия маркер се нарича откриването, а вторият - затваряне. Всички завършващи тагове, които са в началото на наклонена черта (например, на фиг. 2.3 са затваряне маркери. И).
Tags са предназначени за идентифициране на HTML-документ. При откриването маркер на двойката трябва винаги да е в самото начало на кода, и етикет на затваряне - в самия край. С други думи, маркерът започва програма код на страницата, и го завършва с маркера.
ПРЕДУПРЕЖДЕНИЕ Чифт тагове и Той е задължителен атрибут на всеки HTML-документ.
С помощта на чифт тагове се извършва, за да се идентифицира името на уеб страницата. С други думи, целия текст влезе между тези тагове след това ще се появи в заглавието на Internet Explorer прозорци.
Запазване на вашите записи в разширението на файла (ако приемем, че нашият файл се нарича). За да направите това, изпълнете главното меню (тази команда е също натискане на комбинация от клавиши), а след това в прозореца, който се отваря, посочи пътя и името на файла.
Сега ние добавяме нашия код HTML-документ, като добави съответните тагове между заглавна страница и текст тяло. Ще се обадим на нашата уеб страница. и въвеждане (фиг. 2.4) като основния текст.
Като прибавим към заглавната кода на страницата и основния текст
Сега запишете промените, използвайки основната команда от менюто или чрез натискане на комбинация от клавиши. След това ще се отвори прозореца ни уеб-браузър. Ако всичко е направено правилно, то трябва да изглежда, както е показано на фиг. 2.5.
Тестовата страница в прозореца на интернет браузър
Както можете да видите, заглавието на страницата, която се показва в горната част на прозореца на браузъра Internet, а основната му текст в пълно съответствие с програмен код. На тази можете да се поздравяваме: току-що сте създали една проста уеб страница.
Сега ние се промени нашия сайт, за да му се даде по-ергономичен усещане. Първоначално, като се използват тагове и. озаглавена текст се съдържа в страницата. Към това трябва да добавите кода, както е показано на фиг. 2.6.
Добавяне на текст код титла
Забележка - тагове, както и текста на намеса се поставя вътре таговете и. както и преди основния текст.
Сега, това, че думата се появява в курсив и думата - с удебелен шрифт. За тази двойка тагове се използват, съответно, и. В резултат на това, което прави необходимите допълнения до изходния код на нашата уеб страница трябва да изглежда така, както е показано на фиг. 2.7.
Добавянето курсив и смели
Сега промените цвета на фона. За прилага този етикет атрибут. Имайте предвид, че това поле не е задължително, ако то не се използва - цвета на фона по подразбиране е бял (както вече видяхме). Да направим цвета на фона на нашата страница жълто, допълвайки своя програмен код, както е показано на фиг. 2.8.
Промяна на цвета на фона на уеб страницата
ние можем да променим шрифт и цвят, което го прави, например, синьо, ако желаете. За да направите това, отново леко модифицираме код използването на атрибута за маркер. Това поле не е задължително и ако то не се използва, цвета на шрифта по подразбиране е черен (в който ние също вече видяхме).
Цвят на шрифта за да стане синя, нашата уеб страница код трябва да изглежда, както е показано на фиг. 2.9.
Промяна на цвета на шрифта на уеб страницата
Сега ние спаси всички промени и да отвори нашата уеб страница в прозореца на Интернет браузър. Тези действия показано на фиг. 2.10.
Web страница, след като тези подобрения
Както се вижда на фигурата, в съответствие с кодекса променя думата е написана в курсив, думата - смел, а над основния текст се появи с глава. В допълнение, промените цвета на фона на фона на страницата и цвета на текста, който се показва текста.
Една страница, която трябва да се отвори линка
тази страница файл в нашия пример ще бъде призован. Тук не трябва да изпрати своя изходен код, както вече съществуващите знания е достатъчно, за да го създадете без да се насърчава. Именно тази страница трябва да бъде отворен, след като сме добавяне на хипервръзка към страница, която току-що беше експериментира (вж. Фиг. 2.10).
Ние събрахме двете от нашия файл (а) в същата директория. За да създадете хипервръзка към страница. смяна на кода на страницата, както е показано на фиг. 2.12.
По пътя ще разгледаме още един етикет HTML език -. Характерна особеност на маркера е, че тя не се прилага по двойки, но поотделно. С други думи, няма отваряне и затваряне етикет, че е сам. Този етикет се използва за въвеждане на нов ред (от английската дума «почивка»). След текст маркер, за да се продължи с нов ред.
В този пример, ние сме добавили нова линия до програмния код на страницата, така че след думата е поставена марка.
Що се отнася до позоваването, той формира нова линия от текст. Това е кода:
По-долу е текстът на думата, което е в действителност, ще бъде препратка (в този случай думата), а след това се затварящ таг.
В резултат на това ние направихме нашите уеб страница се променя ще изглеждат, както е показано на фиг. 2.13.
Както можете да видите, има нова фраза на страницата ни. който започва с нов ред. И последната дума на фразата е хипервръзка. Забележка - По подразбиране, хипервръзка в текста се подчертава. Ако всичко е направено правилно, след натискане на мишката върху тази връзка, за да страницата (вж. Фиг. 2.11).
Изработени от нашия уебсайт хипервръзка към популярния портал www.mail.ru. За да направите това, ние ще се коригира кода, както е показано на фиг. 2.14.
Външният вид на уеб страница, не се променя - тя ще изглежда точно като на фиг. 2.13. Но сега, ако кликнете на линка. след това ще отвори главната страница на портала www.mail.ru.
По този начин, в този раздел, ние имаме конкретен пример обсъдени основните стъпки за създаване на прост уеб страница. Въпреки това, с цел да се проучи по-задълбочено възможностите за HTML, трябва да сте запознати с основните си маркери. Някои от тях вече знаем, но в действителност има много повече. Това ще бъде обсъдено в следващия раздел.