Съдържание

• Стъпки
• Метод 1 от 1: Написване на HTML страница
• Съвети
• Предупреждения
• Какво ти е необходимо

HTML (Hypertext Markup Language) е основният език за програмиране за разработване на уеб страници. Създаден като прост и удобен език за програмиране. Повечето страници в Интернет са разработени с помощта на една от формите на този език (ColdFusion, XML, XSLT). След като прочетете тази статия, можете да продължите обучението си, като използвате други ресурси в Интернет. Опитайте се да потърсите в интернет други статии, свързани с тази тема.

Стъпки

Метод 1 от 1: Написване на HTML страница

1. 1 Преди да започнете да се запознавате с една от стъпките, представени тук, вижте раздела „Какво ще ви трябва“.
2. 2 Какво трябва да знаете, преди да започнете да разбирате този проблем:
3. 3 Основите. Чували ли сте някога за етикета? Етикетът е заобиколен от ъглови скоби, като думата е вътре. Крайният етикет се изписва в същата форма, но с добавяне на наклонена черта след първата ъглова скоба. Атрибут е незадължителна дума в маркер, която се използва за добавяне на подробности към етикет.
4. 4 Началото на документа. Във всеки текстов редактор, който използвате, поставете следното:
   html> глава> заглавие> wikiHow / заглавие> / глава> тяло> Здравей свят / тяло> / html> голям> / голям>
   Етикетът трябва да бъде затворен със същия маркер, но с наклонена черта след първата ъглова скоба. Има изключения като тагове МЕТА или ДОКТИП.
5. 5 ДОКТИП
   • Обикновено повечето уеб страници са настроени ДОКТИП ”. Това помага да се определи кодирането, както и как ще се възприеме от уеб браузърите. Повечето страници ще работят без него, „но това е необходимо, ако искате да съответствате (Те регулират видовете кодировки в Интернет и начина, по който се използват)... DOCTYPE за HTML 4.01 е представен по-долу:! DOCTYPE html PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd"> Това е един от най -често срещаните DOCTYPE се използва на страници в интернет.Първо, той сочи към типа на страницата, описваща „html“, след това подчертава вида на кодирането и накрая, местоположението на DOCTYPE, което в резултат описва страницата за уеб браузъра.
   • Има различни видове HTML (различни версии, разработени през годините), например с използване на нови тагове или специфични тагове. Някои тагове са оттеглени (вместо тях се използват други по -полезни тагове).
   • b> и i> - това е, което в момента се налага на таговете, тъй като те се използват за трансформиране на текст, но не и спецификации, в резултат на това други етикети идват да ги заменят. Етикет силен> е заместител на b>, и em>, заместител на i>.
   • Важно е предишните тагове да бъдат заменени с тагове, които са повече от форматиране. Ако текстът е преведен, тогава не само форматирането, но и значението му остава същото. Това е семантично правилно.
   • В XHTML версия 2.0, b> и i> не се използва, точно както в HTML версия 3+.
6. 6 HTML „Правило за капсулиране“.
   • Нека да разгледаме по -важните тагове, които се използват в момента. По време на създаването на страницата се използва проста структура. Ако е отворен маркер, в резултат на това, трябва да се затвори... Това се отнася за цялата структура. Ето валиден пример за структурата на оформлението на XHTML:
   • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
   • html xmlns = "http://www.w3.org/1999/xhtml">
   • глава>
   • meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
   • заглавие> Здравей свят! / заглавие>
   • / глава>
   • тяло>
   • h1> Здравей Свят! / h1>
   • / тяло>
   • / html>
   • Примерен код, който издава съобщение Здравей свят... Това се нарича тест Здравей свят.
7. 7 Заглавие
   • Заглавието на уеб страницата е съдържанието между маркера глава>... Това съдържание не може да бъде видяно от потребителя (само заглавието, което е показано в заглавието на страницата). Информация между етикетите глава>, може да включва други тагове, като например:
     
     
     • Етикетът META се използва за информация, която е полезна за търсачките и други помощни програми.
     • LINK маркер, който създава връзка между документи, например за стилове (CSS).
     • SCRIPT маркер, това включва почти всяко уеб кодиране, с възможност за отдалечен достъп (от друг документ).
     • Етикетът STYLE, който по същество е стил, който може да се приложи към страница.
     • Етикетът TITLE е заглавието, което се появява като заглавие на страница във вашия уеб браузър.
   • Нека да видим демонстрация на някои от тях в примерна заглавка, взета от този уебсайт (тя е съкратена):
     • глава>
     • заглавие> ... / заглавие>
     • meta name = "description" content = "..." />
     • link rel = "stylesheet" type = "text / css" href = "..." />
     • meta http-equiv = "content-type" content = "text / html; charset = UTF-8" />
     • style type = "text / css" media = "all"> ... / style>
     • script type = "text / javascript" src = "..."> / script>
     • / глава>
       
       В случай, че не сте забелязали, отделните тагове са маркирани, като действителната информация е премахната. Примерът е доста кратък, показващ почти всеки маркер, който може да бъде намерен в глава>с изключение на HTML коментар (Ще говорим за това в прости маркери).
8. 8 Прости тагове навсякъде
   • Нека да продължим и да видим други тагове. Внимавайте с маркирането и запомнете основното правило „капсулиране“.
     
     
     • силно> Подчертава важен текст.
     • малък> Увеличава текста. Размерът на шрифта се измерва в стандартни единици от 1 до 7, 3 е размерът на текста по подразбиране. ...
     • pre> Определя блок с богат текст. Тъй като е правилно, такъв текст се въвежда с шрифт със същия размер и с всички интервали между думите.
     • em> Показва текст като фраза.
     • del> Зачертава текст.
     • ins> Определя текста, който е вмъкнат в документа.
     • h1> Един от многото маркери за заглавия. Етикетите от този вид започват с „h“, с разлика в броя. Не забравяйте да затворите етикета със същия номер.
     • p> Определя абзац.
     • ! --- ... ---> За разлика от други тагове, коментарът трябва да е вътре в самия маркер. Тази информация е видима само при разглеждане на кода.
     • blockquote> Показва цитат, може да се използва с маркера cite>.
     • Няколко примера по -горе не са пълен списък на съществуващите тагове. За да научите за другите, посетете.
9. 9 Създаване на ясна структура
   • Страниците са проектирани да съхраняват данни в прости набори от тагове, така че да можем да анализираме информацията в параграфи. Компютърът разпознава данни; не знае за контекста или концептуалната връзка. Трябва да създадем удобни за компютри HTML страници. Това се постига с помощта на tag. Той помага да се създаде огромен брой страници. Той може да бъде оформен с CSS и е по -лесен от създаването на големи кодови таблици за оформлението.
     • div> Този маркер е специален, защото може да бъде оформен и да използва отделни информационни блокове, които и потребителят, и компютърът могат да разберат.
   • Нека да разгледаме едно просто HTML оформление, което използва div таг.
     • ! DOCTYPE html PUBLIC "- // W3C // DTD XHTML 1.0 Strict // EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
     • html xmlns = "http://www.w3.org/1999/xhtml">
     • глава>
     • meta http-equiv = "Content-Type" content = "text / html; charset = utf-8" />
     • заглавие> Здравей свят! / заглавие>
     • / глава>
     • тяло>
     • h1> Здравей Свят! / h1>
     • div id = "contentOne">
     • p> Това е текст в div # contentOne. / p>
     • div>
     • p> Абзац в подраздел на div # contentOne / p>
     • / div>
     • / div>
     • / тяло>
     • / html>
   • Използването на div> тагове помага при намиране и промяна на стилове при работа с CSS и Javascript. HTML ще използва различно кодиране, за да работи със CSS стилове и Javascript, за да създаде по -добро и по -отзивчиво потребителско изживяване.

Съвети

• След като прочетете тази статия, не спирайте и не мислете, че сте научили всичко, което трябва да знаете. Винаги има какво да се научи, особено в тази технология.
• Научете, разберете и напишете код.
• Имайте предвид, че някои тагове използват само>. Para и br са някои примери. Други етикети, отворени с>, трябва да бъдат затворени допълнително. Например „div> / div>“.
• Хората очакват нови открития, така че преоткрийте, проектирайте или кодирайте.
• След като научите много, опитайте да научите сървърно програмиране.
• Научете се да работите с CSS, както и с Javascript.

Предупреждения

• Не забравяйте, че HTML е всичко за редактиране на съдържание. Това означава, че HTML се използва само за съхраняване на съдържание в разпознат формат. Други промени трябва да се направят с помощта на други технологии, като CSS. Това също означава да правите „Семантично правилнодори и другите да не го признаят. Други езици за програмиране помагат за изграждането на уеб страници (CSS, Javascript и XML). HTML е конструктор на съдържание.

Какво ти е необходимо

• Текстов редактор, който поддържа ANSI кодиране
• Уеб браузър като Internet Explorer или Mozilla Firefox
• (По избор) HTML редактор wysiwyg или wykiwyg, като Adobe Dreamweaver, Aptana Studio или Microsoft Expression Web