Пример за HTML страница и основите за създаване

Много езици са изобретени, но HTML езикът е един от най-специалните и най-търсените. Много други ключови инициативи в програмирането са свързани с него. Много неща стават достъпни, когато знанието на маркерския език присъства в ума на разработчика - HyperText Markup Language (HTML).

По същество в HTML няма нищо сложно и за няколко минути всеки, най-отдалечен от програмирането и интернет лице, ще създаде HTML страница в бележника. Пример, който заслужава внимание, е простотата, която наистина е достъпна за всички.

Общо описание

HTML файлът е една страница на сайта, въпреки че това може да се твърди, но фактът, че един файл е една страница е разбираем за начало.

HTML файлът започва с DOCTYPE заглавието, което показва, че типът на този файл е HTML. Всички елементи на страницата (таговете) са показани в ъглови скоби. Всяка двойка ("<"И"> ") включва един HTML маркер. Обикновено HTML таговете са сдвоени, т.е. има "/ tag" за всеки "маркер". И двете са затворени в ъглови скоби. Има единични маркери, сред които най-популярният "br /" е преходът към следващия ред.

Най-големият маркер във файла е самият HTML, който включва само два маркера: HEAD и BODY. В първата са направени различни описания, са посочени връзки към други страници, PHP и jаvascript скриптове може да са налице. Във второто се записва съдържанието на страницата. Също така под формата на етикети и скриптове.

Опростена HTML страница

Пример за създаване на такава страница е изброен по-долу в статията. Помислете внимателно.

Раздел HEAD

Основната цел на маркера HEAD е общо описание на страницата и общи скриптове, въпреки че последната е относително относителна концепция. Обикновено тук са важни само две неща:

• ключови думи и описание на страницата;
• връзки към други файлове (* .css и * .js).

За да се покаже съдържание на страницата, съдържанието на този раздел има само непряко значение, защото показва, че някъде в други файлове съществуват правила за CSS за маркери и скриптове на други езици.

HTML страницата има заглавие (TITLE), което се показва, когато посетителят вкара мишката в раздела, където е отворена страницата. Това е важен момент, защото прави страницата много по-представителна, по-лесна за казване, подписана с четлив текст.

Маркерите на META са важни за програмирането по интернет като цяло, но когато искате да създадете HTML страница в бележник, примерът е нежелан да се затрупва с излишни конструкции.

Трябва да се обърне специално внимание на връзките LINK и SCRIPT. Първата посочва мястото, където се намира CSS стиловата листа, втората до мястото на кодовия файл на jаvascript. Може да има много такива препратки.

Ако трябва да се подходи към скриптовете, когато знанията за HTML се засилят, тогава каскадните стилови листове трябва да бъдат обръщани незабавно. В CSS файловете са по-специално правилата за проектиране на HTML тагове.

Секция BODY

Всъщност, пример за HTML страница е BODY дял. Тук съдържа цялата информация, цялото съдържание на страницата на сайта. Цялата информация се представя под формата на маркери и скриптове, например вмъкване на jаvascript код или парчета от PHP програми.

Важно е да се разбере, че примерът на HTML уеб страница в браузъра и един и същ пример в текстов редактор, по-специално в бележника, далеч не е същият. В първия случай имаме готовия HTML-текст, в който се изпълняват всички скриптове. Например, PHP е изпълнил своята част и е генерирал необходимите тагове вместо кода си на точните места. jаvascript изпълни и мисията си, въпреки че все още има отделен разговор за него.

HTML е маркер, а не скрипт. В крайна сметка браузърът показва само съдържанието на страницата, само нейните маркери. Няма PHP код там.

jаvascript е със специален статут, неговата грижа - да служи на страницата, не само по време на зареждане на времето (претоварване), но в моментите, когато страницата е в браузъра на посетителя и го проучванията.

Един прост пример HTML код (само секцията BODY) е изброено по-долу.

И в браузъра на посетителя тя изглежда като показаната по-долу.

Кодът не уточнява как трябва да изглеждат елементите, показвани от браузъра. Целият видим дизайн е в правилата на CSS. В този случай във файла Mcss / scPhpWordRW.css, който е посочен (вижте първия пример на HTML страница).

За разлика от HTML, CSS темата е по-проста, има много достъпни правила и техният брой е малък, когато примерът за създаване на HTML страница не изисква нищо друго освен notepad. Всичко е много достъпно за незабавно овладяване:

Това показва колко е лесно да се описва етикет scLogo_vDoc и това описание е, че в нормално състояние на маркер показва картина vDoc-logo.jpg, а когато мишката е върху него - показва vDoc-лого-h.jpg.

HTML Описание Структура

Езикът не означава никаква структура и концепцията за синтаксиса тук е много относителна. Няма променливи, но има много възможности. Основната основа на хипертекста е, че има елемент (маркер), който задължително има име.

Името, в случай на двойка тагове, се състои от правилното име (tagName) и ъгловите скоби ("<"+ TagName +"> "), ако е началото на маркер и" ", ако е написан неговия край.

Пример за HTML страница, описваща атрибутите, се намира по-долу в текста.

Маркерът може да има атрибути, след което те се поставят след интервал след името на маркера преди ъгъла на затваряне ">". Атрибутите, ако имат маркер, са написани само в началото на маркера. Съдържанието на маркера е това, което е между началото на маркера и неговия край.

Общото съдържание на описанията на HTML

HTML ви позволява да опишете блокови и низови елементи. Първите заемат определена област в прозореца на браузъра, могат да бъдат разположени абсолютно, т.е. на точното място в дисплейната област на HTML страницата, и да имат определен размер.

Елементите на низовете обикновено се показват в една нишка, т.е. както е посочено в файла на страницата, и се показват. Показването на общия поток може да се повлияе, когато страницата се зареди. Разположението, видимостта и други свойства на блоковите елементи могат да бъдат засегнати по всяко време чрез jаvascript код.

В допълнение към простите елементи, HTML предлага описание на таблици и формуляри. Тези елементи са много търсени в "ежедневното изграждане на обекти".

Описание на таблицата: тагове TABLE, TR, TD

Когато TABLE маркер може да се използва за създаване на една маса, да се посочи брой редове и TR в един ред по ред TD клетки. За разлика от обичайната маса на организацията, което се дължи на HTML маркиране организацията табличен на природата ограничава до тази декларация, защото ако предприемачът иска да има правоъгълна маса, в която броят на колоните във всички редове от един и същ, а след това те трябва да отговарят, че за себе си.

Основната позиция на HTML: да се направи всичко, което е посочено, но нищо, което не е разбрано. В някои случаи броят на колоните във всеки ред на таблицата не е толкова важен, но ако трябва да комбинирате клетките вертикално или хоризонтално, ще трябва да преброите всичко много внимателно.

Пример за HTML страница, описваща проста таблица, е ясно показан в статията.

Тук е таблица, показваща големината на три реда по три колони, като първият ред маркер TH се използва вместо TD маркер - заглавната част на колона. Особено отличава тези две тагове не са, но това е възможно да се използват на първо да се прави разлика между първия ред на таблицата, и в CSS да TH, можете да прикачите свой собствен стил, който го отличава от другите TD.

Описание на формуляра: FORM, INPUT тагове

Формулярите са най-търсената част от HTML маркерите. Използвайки формуляри, можете да прехвърляте информация. Всъщност самата страница е изход на информация, но формата е нейният вход.

Пример за HTML страница с обикновено описание на формуляра:

Вариантите на използването на формулярите са много по-големи, но основните възможности са както следва. Можете да зададете полетата за въвеждане, да ги зададете на проекта и обработващите устройства, за да анализирате входа на потребителя. Можете да посочите скрити полета и да изпратите информация от страницата. Можете да определите бутоните за прехвърляне на информация, като кликнете върху това, което инициира прехвърлянето на информация.

Използване на HTML

За да научите език за хипертекст - задължително условие за всяка работа, специализация в областта на програмиране в Интернет, но ако искате да се напише програма на PHP или jаvascript, тогава знаете HTML + CSS нужда перфектно.

PHP езикът е означен в предишния пример. PHP се изпълнява на сървъра, защото страницата с този формуляр е прелетяла от сървъра в браузъра с попълнените полета. По-специално, функцията Testonblur, посочена в маркера INPUT (onblur събитие манипулатор), получи всички параметри под формата на текстови полета.

Браузърът работи jаvascript, както и за правилно работил данни изпратете бутона обратно на сървъра, което е, дизайн :. onclick = JQuery ( "# да") Вал ( "кошница"), е необходимо да се знае не само за това, JQuery, но и това, което е #to, val, количка. По-точно, трябва да знаете основните HTML тагове и общите правила за прилагане на CSS стилове към тях.

Това е достатъчно, за да се повиши бързо тяхната квалификация за всяка специализация в областта на интернет програмирането.