ХТМЛ Див: примери употребе

12. 3. 2019.

Формализација информација је важан аспект објективне изјаве и исправног решења задатка стварања ефективног сајта. Резултат формализације је систематска репрезентација предметне области, структура односа између података и конструкција тематских блокова. ХТМЛ таг је блок информација, део општег система, резултат процеса обраде информација о компетентности и функционалности веб ресурса.

Општа структура и логика веб странице

Формално, претраживачи се разликују од он-лине продавница, а пословне картице су потпуно другачије од корпоративних портала. Обично није тешко разумети логику девелопера, али идеје купца могу се представити само у времену и динамици развоја сајта. Општи обрасци стварања висококвалитетних ресурса су се формирали и сматрају се основним. Модеран посетилац сајта је “компетентан” увек и на било ком веб сајту “зна” шта да ради.

Структура ХТМЛ странице

Сваки од популарних система за управљање сајтовима нуди сопствени поглед на фундаменталне позиције у дизајну и важне ентитете у структури и садржају страница сајта. На стари начин, сви су означени са див на ХТМЛ страници:

  • цап;
  • “Боди” + мени (вертикално или хоризонтално);
  • леви и / или десни ступови као делови тела или његов комплемент;
  • у подруму.

У тренутној употреби програмера, све ово звучи више прозаично: заглавље, тело, подножје или "заглавље", "садржај" и "подножје". Да бисте додали или не леву и десну колону, односно да поделите садржај сајта у централни ток података, лева и десна страна су компетентност програмера и појединости проблема које треба решити.

Користите табеле (табела ХТМЛ) или див (ХТМЛ див) - нема посебне разлике. Чак можете “објаснити” цијелу страницу с једном листом (ул и ли): ово је свјеже и екстравагантно, али ће радити. Избор распореда за извођача, али према устаљеној традицији, свако бира распоред у блоковима. Користите ХТМЛ див и стиле ЦСС - једноставна, читљива и продуктивна.

Суштина информационог блока

Термин "информације" у Интернет програмирању има своје значење. Ови подаци су дефинитивно структурирани и презентирани. Информације су много шири појам. Ин програмирање веб ресурса Овај термин носи минимално могуће значење и обим.

Семантика ХТМЛ блока блока

Величина и позиција ХТМЛ ознаке див: видтх / хеигхт и лефт / топ могу бити апсолутне и релативне. Постављањем међусобних ознака можете манипулисати позицијом и величином. Промена правила ЦСС позиција од апсолутног до релативног, можете контролисати положај ознака у односу на сваки други унутар прозора претраживача.

Прегледник као апликација носи наслеђе локалног програмирања: то је програм који има прозор у којем се приказује хипертекстуални језик, допуњен ЦСС стиловима и анимиран радом ЈаваСцрипт кода.

Подсећамо се на поделу развоја на фронтенд и бацкенд, коју воле све компаније (Интернет студији), али то не мења суштину. Није важно како се блок појавио на ХТМЛ страници: написан је у “оловкама” или је настао као резултат ПХП скрипта који се изводи на серверу. Важно је да свака див ознака као ХТМЛ / ЦСС композиција буде позиција, величина, боја (карактер / позадина), транспарентност, трансформација, кретање, границе итд.

Атрибути и карактеристике за опис блока информација ЦСС правила пружају велику разноликост, а ХТМЛ логика омогућава коришћење дивова и за њихову намену и за логику и искуство девелопера.

На пример, ХТМЛ див је:

  • омот, тј. постављање система ознака;
  • област за постављање тачака за ЈаваСцрипт руковаоце;
  • "Арраи" тагова за обраду.

Прва опција је погодна када вам је потребна танка композиција ознака, која се лако може померити на право место, наводећи само координате омотача: све унутрашњост ће се кретати како је, аутоматски.

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

Мапа локације

Трећа опција увелико поједностављује руковање колекцијама ознака: уместо да пролази кроз читаву колекцију ХТМЛ див (боди) тагова, програмер може да изврши претрагу унутар једне ознаке која је невидљива и не чује, али укључује све релевантне позиције.

Пример описа и употреба див

Доследност у свим питањима протока информација. Токови информација између претраживача и сервера увек имају важне временске и техничке параметре, али то уопште не значи излазак ХТМЛ тока као што је у прозору претраживача.

Пример дивирања

У примјеру су описана само два блока, при чему други блок разбија садржај првог на два дијела. Ова околност не утиче на резултат. Други блок је пола транспарентан и покрива први блок. Што се тиче мешања боја, нема проблема и постоји ефекат који се може користити.

Преклапање једног текста на други је сумњиво тражен резултат, али опција Лооп је занимљиво рјешење. Можете имати блок текста у којем ће бити плутајући див са детаљима о ријечима или изразима. Могуће је и друго практично решење.

Класе и идентификатори блокова

ХТМЛ је скуп елемената. ЦСС стилови вам омогућују да креирате њихове класе. Јединствене ставке се идентификују идентификаторима. И почетници и искусни програмери могу користити идентификаторе попут класа, када нема потребе за тражењем елемената преко ЈаваСцрипт руковаоца.

Класе и ИД-ови

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

Програмер је приморан да користи класе када је сајт развијен на основу система за управљање сајтовима или користи популарни шаблон. Пракса показује да знање и вештине инвеститора увек предлажу исправан излаз из сваке ситуације.

Важно је да свака синтактички исправна употреба див-а у ХТМЛ-у функционише како је прописано правилима.

Заглавља и једноставни блокови

ХТМЛ-страница у класичном смислу открива тему. У суштини, наслов одређује контекст странице. Блокови информација се називају идентификатори - ово је назив за програмера. Име класе уопште није име, већ веза на скуп правила. Једна дива може бити додељена неколико класа, али само један идентификатор.

Заглавља и једноставни блокови

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

Могућност међусобног уграђивања блокова, исправно преклапање блокова и њихова раскрсница омогућавају развој продуктивних страница и креирање тематски завршених локација.

Вондерфул лаиоут

Оријентација према динамичном и развијеном резултату је систематизована информација, односно систем блокова међусобно повезаних значењем односа. Није битно шта да узмемо као основу: табелу, листу или само блок.

Пракса показује: морате користити све ХТМЛ елементе у складу са њиховом основном сврхом и комбиновати жељено решење.

Формализација обима и проблема који треба ријешити је главни циљ при креирању било којег веб-ресурса. Стварни резултат зависи од тога колико је исправно и свеобухватно обављен аналитички рад.