Таилвинд услужни програми за контролу породице фонтова елемента

Tailvind Usluzni Programi Za Kontrolu Porodice Fontova Elementa



Кад год се дизајнира веб страница, битно је да текстуални садржај буде задивљујући. Ако је тешко гледати, или није тако привлачан, онда секундарни дизајн веб странице такође губи смисао. Због тога програмер мора одабрати праву породицу фонтова и дизајн за текст. У ту сврху, Таилвинд обезбеђује услужне програме за породицу фонтова који омогућавају кориснику да контролише стил фонта елемента.

Овај чланак пружа процедуру за контролу породице фонтова елемента помоћу услужних програма Таилвинд.

Како контролисати породицу фонтова елемента користећи Таилвинд услужне програме?

Да бисте контролисали фамилију фонтова елемента у Таилвинд-у, елементу се мора обезбедити следећи услужни програм:







фонт- { породица фонтова }

Постоје три подразумеване породице фонтова које се могу подесити помоћу горе наведеног услужног програма. Ови укључују ' сериф ', ' без ', и ' моно ”.



Хајде да користимо ове породице фонтова у демонстрацији користећи „ фонт-{фонт фамили} ” да видите како то функционише:



< див класа = ' фонт-сериф роундед-кл схадов-лг тект-центер пи-2 ми-2 бг-греен-100 ' >
Ово је породица ФОНТ-СЕРИФ
< / див >
< див класа = ' фонт-санс роундед-кл схадов-лг тект-центер пи-2 ми-2 бг-блуе-100' >
Ово је ФОНТ-САНС породица
< / див >
< див класа = 'фонт-моно роундед-кл схадов-лг тект-центер пи-2 ми-2 бг-ред-100' >
Ово је породица ФОНТ-МОНО
< / див >

Објашњење за горњи код је следеће:





  • Постоје три елемента див креирана помоћу „ <див> ” и имају различите породице фонтова.
  • породица фонтова} ” ће обезбедити одређену породицу фонтова за текст у елементу.
  • роундед-кл ” ће учинити углове елемента див округлим.
  • схадов-лг ” ће дати велику сенку елементу див.
  • текстуални центар ” ће поравнати текст са средиштем елемента.
  • пи-2 ' и ' мој-2 ” часови ће обезбедити “ 8пк ” паддинг и маргина у горњем и доњем правцу елемента.
  • бг-{цолор}-{нумбер} ” класа је одговорна за постављање позадине елемента на наведену боју.

Из излаза је јасно да сваки елемент има другачију породицу фонтова:



Такође можемо динамички променити фамилију фонтова елемента помоћу функције лебдења. За илустрацију, прођите кроз код испод:

< див класа = 'ми-2 роундед-кл бг-слате-100 пи-2 тект-центер фонт-моно схадов-лг ховер:фонт-сериф' >Ово је подразумевано фамилија ФОНТ-МОНО< / див >

У горе наведеном коду, „ лебдећи мишем: фонт-{фамили} ” услужни програм је одговоран за промену породице фонтова елемента чим курсор миша пређе преко њега. На излазу се може видети да се породица фонтова текста мења када корисник пређе курсором миша преко ње:

То је све о контролисању породице фонтова елемента у Таилвинд-у.

Закључак

У Таилвинд, елементу се може доделити породица фонтова помоћу „ породица фонтова} ' класа. Постоје три подразумеване породице фонтова које обезбеђује Таилвинд, тј. без ', ' сериф ', и ' моно ”. Корисник такође може да промени породицу фонтова елемента након промене стања елемента. Овај чланак је пружио процедуру за контролу породице фонтова елемента у Таилвинд-у.