рачунари

ХТМЛ основе - Елементи изгледа

Август 2022

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

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

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

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







Горњи узорак кода саставио би један ред, једну таблицу ступаца. Можете користити више редова и ступаца за израду сложеније табеле за позиционирање текста и слика. Табела са више редова и ступаца изгледа овако:









   
   


Постављањем текста и слика у одговарајуће редове и ступце, те елементе можете позиционирати по жељи око своје веб странице. Табеле могу бити видљиве, као у горњем примеру, ако поставите обруб на "1" или више. Подешавањем 'бордер = "0"' се ствара невидљива табела. Много веб страница се састоји од угнијежђених невидљивих таблица, а једна велика таблица садржи главне одјељке страница (попут менија) и мање таблице унутар којих се налази главни дио странице.

Укључивањем ЦСС-а (Цасцадинг Стиле Схеетс), елемент див постао је свој властити изглед. Дизајнери сада могу користити ЦСС за постављање див-ова на одређене локације широм странице, уз још прецизније резултате него што их могу постићи таблице. На пример, дизајнер може да користи следећу ознаку див да би ставио слику у средину веб странице:





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

Уроки по CSS/CSS3. Часть 4. Позиционирование элементов (Август 2022)



Ознаке Чланак: ХТМЛ основе - Елементи изгледа, ХТМЛ, ХТМЛ, ЦСС, каскадни листови стилова, табела, табеле, див, дивс, див ознаке, ознаке табела, распоред табела, распоред делова, редови табеле, ступци таблица

Популарне Беаути Порука

Хелмет Хаир
Кућа и башта

Хелмет Хаир

Вољени Импостер
књиге и музика

Вољени Импостер

Убиство Осаме Бин Ладена

Убиство Осаме Бин Ладена

вести и политика