Овај практични водич ће илустровати метод управљања размаком и паддингом у прилагодљивим дизајнима.
Како управљати размаком и паддингом у респонзивним дизајнима?
Падинг и размаци у респонзивним дизајнима могу се управљати помоћу ЦСС-а. Практична демонстрација управљања размаком и паддингом је дата у наставку.
Корак 1: Креирајте ХТМЛ структуру
Прво направите ХТМЛ структуру и неки текст унутар ње користећи <х2> и <див> ознаке:
< тело >
< х2 > Прилагодљиви ЦСС паддинг и размак < / х2 >
< див > Овај ЦСС елемент има паддинг од 80пк и размак од 40пк. < / див >
< / тело >
Корак 2: Примените ЦСС
Сада, хајде да применимо ЦСС на <див> таг. Прво поставите „ паддинг ” вредност својства на “ 80пк ” да направите простор око елемента. Затим поставите „ маргина ” вредност својства на “ 40пк ” и креирајте простор око елемената изван границе. На крају, користите „ граница ” и наведите ивицу и боју да бисте направили ивицу:
див {паддинг : 80пк ;
маргина : 40пк ;
граница : 1пк чврст зелен ;
}
Горњи излаз потврђује да су размак и паддинг примењени.
Хајде да проверимо да ли реагује или не тако што ћемо склопити прозор прегледача:
Сажимањем прозора, садржај се понашао одговорно, што потврђује да су примењени паддинг и размак прилагодљиви.
Закључак
Да бисте управљали размацима и допунама у респонзивним дизајнима, постоје ЦСС својства. Да бисте додали допуну у респонзивни дизајн помоћу „ паддинг ' имовина. Слично томе, размак се може додати у респонзивни дизајн помоћу „ маргина ' имовина. Овај текст је корисницима представио решење за управљање размаком и паддингом у прилагодљивим дизајнима.