Преглед садржаја
Веб прегледачи попут Фирефок, Цхроме, Сафари, Опера итд. Сви они следите правила о томе како променити величину елемената у зависности од тока и изгледа страницеОва правила могу бити врло детаљна, али то нам омогућава да одредимо како треба третирати елементе тако да се величине увек држе пропорционално ономе што од њих желимо.Својства величине
Постоје нека својства величине која нам омогућавају да прегледачу кажемо како треба да тумачи наше елементе, да видимо њихову листу пре него што одемо у њихову апликацију:
Ширина Висина: Они конфигуришу ширину и висину елемента, вредности које може да преузме су следеће: ауто и.
мин-ширина / мин-висина: Омогућава нам да поставимо минималну ширину или висину за елемент, вредности које може да преузме су следеће: ауто и
мак-видтх / мак-хеигхт: Поставља највећу прихватљиву висину или ширину за елемент, његове могуће вредности су: ауто и
димензије кутије: Одређује који део оквира са елементима се узима за величину, а доступни су следећи: садржај-оквир паддинг-бок гранични оквир-маргин-бок.
Ако не поставите никакву вредност прегледаним својствима, подразумевана вредност ће бити: ауто, чак и ако није наведена, што значи да ће прегледач бити тај који поставља величине, такође, као што смо видели, можемо подесити величине помоћу мерење дужине или проценти, проценти се израчунавају на основу ширине елемента контејнера.
Пошто смо видели теорију, сада ћемо прећи у праксу, да видимо следећи код где ћемо поставити величину два елемента тако да видимо како све ово функционише:
Пример
Као што видимо, оно што смо овде урадили је врло једноставно, утврдили смо ширину и висину за див елемент странице, затим наводимо два идентификатора на која постављамо сваки различити димензије кутијеХајде да видимо шта нам све ово ствара:
Шта се дешава ако се сада мало поиграмо са променом величине прозора прегледача, знамо да ће див бити 75% величине његовог контејнера, у овом случају његов контејнер је тело које се мења са прозором и заузврат слику са селектором #први То је 50% ширине његовог контејнера, што је у овом случају див, када ово видимо знамо да се нешто неће задржати онако како јесте, хајде да видимо шта се дешава у прегледачу са свим овим.
ЕНЛАРГЕ
