Овај чланак ће објаснити:
- Шта раде екрани, боје и размаци у теми Таилвинд?
- Како користити екране, боје и размаке у теми Таилвинд?
- Како конфигурисати екране, боје и размак у теми Таилвинд?
Шта раде екрани, боје и размаци у теми Таилвинд?
Тхе екрани кеи дозвољава корисницима да модификују тачке прекида у Таилвинд пројекту. Преломне тачке су тачке у којима се изглед мења на основу ширине екрана. Таилвинд подразумевано укључује пет екрана, тј. см (мали), мд (средњи), лг (велики) и кл (екстра-велики). Међутим, корисници могу да дефинишу своје тачке прекида помоћу тастера „сцреенс“, а затим да их користе у ХТМЛ програму.
Боје тастер се користи за измену палете боја. Боје су једна од најважнијих карактеристика дизајна. Таилвинд тема пружа подразумевану палету боја са широким спектром нијанси, али корисници такође могу да је прилагоде или прошире својим бојама. Корисници могу да дефинишу боје помоћу тастера „цолорс“, а затим да их користе са било којом класом услужних програма која се односи на боју у ХТМЛ коду.
Тхе размак кључ се користи за модификовање размака и скале величине. Размак је још један суштински аспект дизајна, јер утиче на читљивост, поравнање и баланс елемената. Тема Таилвинд обезбеђује доследну скалу размака на основу основне вредности од 4 пиксела (0,25 рем). Међутим, такође се може прилагодити или проширити прилагођеним вредностима. Корисници могу дефинисати вредности размака помоћу тастера „размак“, а затим их користити са било којом класом услужних програма која се односи на размак у програмској датотеци.
Како користити екране, боје и размаке у теми Таилвинд?
Да бисте користили екране, боје и размаке у теми Таилвинд, направите ХТМЛ програм и користите подразумевана својства екрана, боја и размака по потреби. Затим покрените ХТМЛ програм и погледајте ХТМЛ веб страницу. Хајде да следимо доле наведене кораке:
Корак 1: Креирајте ХТМЛ веб страницу
Прво направите ХТМЛ програм и користите подразумевана својства екрана, боја и размака:
<боди ><див цласс = 'х-сцреен п-10 см:бг-ред-700 мд:бг-блуе-600 лг:бг-греен-500 кл:бг-пинк-700 ' >
<х1 класа = 'текст-3кл м-5 см:текст-бели текст-центар' >
Линук савет!
>
<х2 класа = 'текст-2кл м-5 мд:текст-бели текст-центар' >
Добродошли у овај водич
>
<х3 класа = 'текст-2кл м-5 лг:текст-бели текст-центар' >
Таилвинд ЦСС
>
<п цласс = 'текст-2кл м-5 кл:текст-бели текст-центар' >
Теме
>
>
>
овде:
- “ -п-10 ' и ' м-5 ” су својство размака.
- “ см ”, “ доктор медицине ”, “ лг ', и ' кл ” су својства екрана.
- “ црвена-700 ”, “ плава-600 ”, “ зелено-500 ”, “ розе-700 ', и ' бео ” су својства боје.
Корак 2: Покрените ХТМЛ програм
Затим покрените ХТМЛ програм да бисте видели ХТМЛ веб страницу:
У горњем излазу се могу видети подразумевани екрани, боје и својства размака.
Како конфигурисати екране, боје и размак у теми Таилвинд?
Да бисте конфигурисали екране, боје и размаке у теми Таилвинд, погледајте наведене кораке:
- Отвори ' таилвинд.цонфиг.јс ” фајл.
- Иди на „ тема ” и прилагодите екране, боје и својства размака по потреби.
- Користите прилагођена својства у ХТМЛ програму.
- Погледајте ХТМЛ веб страницу за верификацију.
Корак 1: Конфигуришите екране, боје и размаке у конфигурационој датотеци Таилвинд
У „ тема ” одељак „ таилвинд.цонфиг.јс ” датотеку, прилагодите екране, боје и својства размака према потреби. На пример, прилагодили смо ова својства на следећи начин:
модул .извоза = {садржаја : [ './индек.хтмл' ] ,
тема : {
//прилагођавање екрана
екрани : {
см : '480пк' ,
доктор медицине : '668пк' ,
лг : '876пк' ,
кл : '1100пк' ,
} ,
//прилагођавање боја
боје : {
бео : #фффффф ,
црн : '#000000' ,
Плави : '#08609ц' ,
зелен : '#089ц28' ,
црвена : '#9ц0306' ,
жута : '#еде60е' ,
розе : '#ед0е55' ,
} ,
//прилагођавање размака
размак : {
пк : '1пк' ,
'0' : '0' ,
'1' : '0,25 рем' ,
'2' : '0.5рем' ,
'3' : '0,75 рем' ,
'4' : '1 ствар' ,
'5' : '1.25 рем' ,
'6' : '1.5рем' ,
'8' : '2рем' ,
'10' : '2.5рем' ,
'12' : '3рем' ,
'16' : '4рем' ,
'двадесет' : '5рем' ,
}
} ,
} ;
У овом коду:
- „ екрани ” својство дефинише тачке прекида екрана за различите величине. Обезбеђује псеудониме (као што су см, мд, лг, кл) и њихове еквивалентне вредности.
- „ боје ” својство дефинише прилагођене боје користећи њихов назив и парове хексадецималне вредности.
- „ размак ” својство наводи прилагођене вредности размака за многе величине. Користи псеудониме (као што су пк, 0, 1, 2, итд.) за представљање специфичних вредности размака у „рем“ јединицама.
Корак 2: Користите конфигурисана својства у ХТМЛ програму
Сада користите прилагођена својства у ХТМЛ програму:
<боди ><див цласс = 'х-сцреен п-10 см:бг-ред мд:бг-блуе лг:бг-греен кл:бг-пинк ' >
<х1 класа = 'текст-3кл м-5 см:текст-бели текст-центар' >
Линук савет!
>
<х2 класа = 'текст-2кл м-5 мд:текст-бели текст-центар' >
Добродошли у овај водич
>
<х3 класа = 'текст-2кл м-5 лг:текст-бели текст-центар' >
Таилвинд ЦСС
>
<п цласс = 'текст-2кл м-5 кл:текст-бели текст-центар' >
Теме
>
>
>
Корак 3: Прегледајте ХТМЛ веб страницу
На крају, проверите излаз тако што ћете погледати ХТМЛ веб страницу:
Може се приметити да се садржај веб странице мења у складу са конфигурисаним екранима, бојама и својствима размака.
Закључак
Тхе екрани кључ дозвољава корисницима да прилагоде/изменију преломне тачке које одговарају, боје тастер се користи за прилагођавање палете боја за пројекат и размак кључ се користи за прилагођавање размака и скале величине. Штавише, корисници могу прилагодити ове кључеве или својства према својим потребама. Овај чланак је објаснио екране, боје и размаке у теми Таилвинд.