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