Прављење веб страница почиње са ХТМЛ-ом. Улепшати их и учинити интерактивним долази касније. Али да бисте почели да правите функционалне статичке веб странице, потребно вам је разумевање ХТМЛ-а. (Желите ли брз увод у овај језик за означавање? Прочитајте наше ХТМЛ ФАК.)

Као део учења језика, постоји дуга листа елемената које морате да додате свом ХТМЛ речнику. И овај задатак у почетку може изгледати застрашујуће, због чега смо смислили следећу варалицу. Омогућава вам једноставан начин да откријете/разумете/позовете ХТМЛ елементе кад год вам затребају.

Образац за варање покрива ознаке и атрибуте за структурирање веб страница, форматирање текста, додавање образаца, слика, листа, веза и табела. Такође укључује ознаке које су уведене у ХТМЛ5 и ХТМЛ кодове за најчешће коришћене специјалне знакове.

БЕСПЛАТНО СКИДАЊЕ: Ова варалица је доступна као ПДФ за преузимање од нашег партнера за дистрибуцију, ТрадеПуб. Мораћете да попуните кратак образац да бисте му приступили само по први пут. Преузимање ХТМЛ Ессентиалс Цхеат Схеет.

instagram viewer

ХТМЛ Ессентиалс Цхеат Схеет

... ... ... ... ...
Пречица поступак
Основне ознаке
... Прва и последња ознака ХТМЛ документа. Све остале ознаке леже између ових отварајућих и завршних ознака.
... Одређује прикупљање метаподатака за документ.
... Описује наслов странице и приказује се у насловној траци претраживача.
... Укључује сав садржај који ће бити приказан на веб страници.
Информације о документу
Помиње основни УРЛ и све релативне везе до документа.
За додатне информације о страници попут аутора, датума објављивања итд.
Везе ка спољним елементима као што су стилови.
Садржи информације о стилу документа као што је ЦСС (каскадни стилски листови).
Садржи везе ка спољним скриптама.
Форматирање текста
... ИЛИ
...
Подебљава текст.
... Исписује текст у курзиву и подебљава га.
... Исписује текст у курзиву, али га не подебљава.
... Прецртан текст.
... Цитира аутора цитата.
... Означава избрисани део текста.
... Приказује одељак који је уметнут у садржај.
...
За приказивање цитата. Често се користи са таг.
... За краће цитате.
... За скраћенице и пуне облике.
...
Одређује контакт детаље.
... За дефиниције.
... За исечке кода.
... За писање индекса
... За писање суперскриптова.
... За смањење величине текста и означавање сувишних информација у ХТМЛ5.
Структура документа
... Различити нивои наслова. Х1 је највећи, а Х6 најмањи.
...

За поделу садржаја на блокове.
... Укључује уметнуте елементе, као што су слика, икона, емотикон, без уништавања форматирања странице.

...

Садржи обичан текст.

Креира нову линију.

Црта хоризонталну траку да прикаже крај одељка.
Листе
    ...
За наручени списак артикала.
    ...
За неуређену листу ставки.
  • ...
  • За појединачне ставке на листи.
    ...
    Списак предмета са дефиницијама.
    ...
    Дефиниција једног термина у складу са садржајем тела.
    ...
    Опис за дефинисани појам.
    Линкови
    ... Сидрена ознака за хипервезе.
    ... Ознака за повезивање са адресама е-поште.
    ... Сидрена ознака за навођење бројева контаката.
    ... Сидрена ознака за повезивање са другим делом исте странице.
    ... Прелази на див одељак веб странице. (Варијација горње ознаке)
    Слике

    За приказивање сликовних датотека.
    Атрибути за таг
    срц=”урл” Веза до изворне путање слике.
    алт=”текст” Текст који се приказује када се мишем пређе преко слике.
    висина=” ” Висина слике у пикселима или процентима.
    ширина=” ” Ширина слике у пикселима или процентима.
    алигн=” ” Релативно поравнање слике на страници.
    граница=” ” Дебљина ивице слике.
    ... Веза до карте на коју се може кликнути.
    ...
    Назив слике карте.
    Област слике на мапи слике.
    Атрибути за таг
    облик=” " Облик области слике.
    цоордс=” ” Координате области слике карте.
    Формс
    ...
    Надређена ознака за ХТМЛ образац.
    Атрибути за
    таг
    ацтион=”урл” УРЛ адреса на коју се шаљу подаци обрасца.
    метод=” ” Одређује протокол за подношење обрасца (ПОСТ или ГЕТ).
    енцтипе=” ” Шема кодирања података за ПОСТ поднеске.
    аутоцомплете Одређује да ли је аутоматско довршавање обрасца укључено или искључено.
    новалидате Одређује да ли образац треба да буде валидиран пре подношења.
    аццепт-цхарсетс Одређује кодирање знакова за слање обрасца.
    циљ Показује где ће бити приказан одговор на подношење обрасца.
    ...
    Групише повезане елементе у форми/
    Одређује шта корисник треба да унесе у свако поље обрасца.
    ... Натпис за елемент скупа поља.
    Одређује коју врсту уноса треба узети од корисника.
    Атрибути за таг
    типе=”” Одређује тип уноса (текст, датуми, лозинка).
    име=”” Одређује назив поља за унос.
    вредност=”” Одређује вредност у пољу за унос.
    сизе=”” Поставља број знакова за поље за унос.
    максимална дужина=”” Поставља ограничење дозвољених знакова за унос.
    потребан Поље за унос чини обавезним.
    ширина=”” Поставља ширину поља за унос у пикселима.
    висина=”” Поставља висину поља за унос у пикселима.
    плацехолдер=”” Описује очекивану вредност поља.
    образац=”” Одређује регуларни израз који се може користити за тражење образаца у тексту корисника.
    мин=”” Минимална дозвољена вредност за улазни елемент.
    мак=”” Максимална дозвољена вредност за улазни елемент.
    онеспособљени Онемогућава улазни елемент.
    За хватање дужих низова података од корисника.
    Одређује листу опција које корисник може да бира.
    Атрибути за
    име=”” Одређује име за падајућу листу.
    сизе=”” Број опција које се дају кориснику.
    вишеструко Подешава да ли корисник може да изабере више опција са листе.
    потребан Одређује да ли је избор опције/е неопходан за подношење обрасца.
    аутофокус Одређује да падајућа листа аутоматски долази у фокус након учитавања странице.
    Дефинише ставке у падајућој листи.
    вредност=””
    Приказује текст за било коју опцију.
    изабрани Поставља подразумевану опцију која се приказује.
    Ознака за креирање дугмета за подношење обрасца.
    Објекти и ифрамеови
    ... Описује уграђени тип датотеке.
    Атрибути за таг
    висина=”” Висина објекта.
    ширина=”” Ширина објекта.
    типе=”” Тип медија који објекат садржи.
    Инлине оквир за уграђивање спољних информација.
    име=”” Име иФраме-а.
    срц=”” Изворна УРЛ адреса за садржај унутар оквира.
    срцдоц=”” ХТМЛ садржај унутар оквира.
    висина=”” Висина иФраме-а.
    ширина=” ” Ширина иФраме-а.
    Додаје додатне параметре за прилагођавање иФраме-а.
    ... Уграђује спољну апликацију или додатак.
    Атрибути за таг
    висина=” “ Подешава висину уградње.
    ширина=” “ Подешава ширину уградње.
    типе=”” Тип или формат уградње.
    срц=”” Изворна путања уграђене датотеке.
    Табле
    ...
    Дефинише сав садржај за табелу.
    ...
    Опис табеле.
    Заглавља за сваку колону у табели.
    Дефинише податке о телу за табелу.
    Описује садржај за подножје табеле.
    Садржај за један ред.
    ... Подаци у једној ставци заглавља.
    ... Садржај унутар једне ћелије табеле.
    Групише колоне за форматирање.
    Једна колона информација.
    ХТМЛ5 нове ознаке
    ...
    Одређује заглавље веб странице.
    ...
    Одређује подножје веб странице.
    ...
    Означава главни садржај веб странице.
    ...
    Одређује чланак.
    Одређује садржај бочне траке на страници.
    ...
    Одређује одређени одељак на веб страници.
    ...
    За описивање додатних информација.
    ... Користи се као наслов за горњу ознаку. Увек је видљив кориснику.
    ... Прави оквир за дијалог.
    ...
    Користи се за укључивање графикона и слика.
    ...
    Описује а
    елемент.
    ... Истиче одређени део текста.
    Скуп навигационих веза на веб страници.
    ... Одређена ставка са листе или менија.
    ... Мери податке у датом опсегу.
    ... Поставља траку напретка и прати напредак.
    ... Приказује текст који не подржава Руби напомене.
    ... Приказује детаље карактера типографије источне Азије.
    ... Рубин напомена за источноазијску типографију.
    Идентификује време и датум.
    Прелом реда унутар садржаја.
    ¹ХТМЛ5 карактерни објекти
    " ИЛИ
    &куот;
    Знаци навода
    < ОР
    &лт ;
    Знак мање од (
    > ИЛИ
    &гт ;
    Знак веће од (>)
    ИЛИ
    &нбсп ;
    Непрекидни простор
    © ОР
    &цопи ;
    Симбол ауторских права
    ™ ОР
    &уцирц ;
    Симбол жига
    @ ИЛИ
    &Уумл ;
    симбол „на“ (@)
    & ОР
    &амп ;
    Симбол амперсанда (&)
    • ИЛИ
    &оумл ;
    Мали метак
    ¹Занемари размак испред тачке и зареза док куцате ХТМЛ знак.

    Направите веб локацију за практично искуство

    Једном када сте разумели основе ХТМЛ кода и имају радно знање о ЦСС-у и ЈаваСцрипт-у, окушајте се у изради веб странице Како направити веб локацију: за почетникеДанас ћу вас водити кроз процес прављења комплетне веб странице од нуле. Не брините ако ово звучи тешко. Водићу вас кроз то на сваком кораку. Опширније . Такође, обавезно сачувајте наше ЦСС3 својства цхеат схеет Тхе Ессентиал ЦСС3 Пропертиес Цхеат СхеетСавладајте есенцијалну ЦСС синтаксу помоћу нашег листа са ЦСС3 својствима. Опширније и ЈаваСцрипт цхеат схеет Тхе Ултимате ЈаваСцрипт Цхеат СхеетНабавите брзо освежење о ЈаваСцрипт елементима помоћу ове варалице. Опширније за будућу употребу!

    Аксхата је обучавао ручно тестирање, анимацију и УКС дизајн пре него што се фокусирао на технологију и писање. Ово је спојило две њене омиљене активности — давање смисла за системе и поједностављивање жаргона. На МакеУсеОф-у, Аксхата пише о томе како најбоље искористити своје Аппле уређаје.