Ուսումնասիրելով վեբ դիզայնի առաջատարը

Վեբ դիզայնը միշտ գրաֆիկական եւ տպագիր դիզայնի աշխարհից ստացել է սկզբունքներ եւ սահմանումներ: Սա հատկապես ճիշտ է, երբ խոսքը վերաբերում է վեբ տիպաբանությանը եւ այն ձեւին, որով մենք ստանում ենք նամակներ մեր վեբ-էջերում: Այս զուգահեռները միշտ չէ, որ 1-ից 1 թարգմանություններ են, բայց դուք, անշուշտ, կարող եք տեսնել, թե որտեղից մեկ կարգապահությունը ազդել է մյուսի վրա: Սա հատկապես ակնհայտ է, երբ համարում եք «առաջատար» ավանդական տիպաբանության տերմինը եւ CSS- ի գույքը որպես «գծի բարձրություն»:

Առաջատարի նպատակը

Երբ մարդիկ ձեռքով մետաղյա կամ փայտե տառեր էին օգտագործում, տպագիր էջի տիպաբանությունը ստեղծելու համար, տեքստի հորիզոնական գծերի միջեւ տեղադրվեցին նարնջագույն կապարի կտորներ, որպեսզի այդ գծերի միջեւ միջակայք ստեղծեն: Եթե ​​դուք ուզում եք ավելի մեծ տարածք, ապա դուք կցանկանաք տեղադրել կապարի ավելի մեծ մասեր: Այսպիսով, «առաջատար» տերմինը կազմվել է: Եթե ​​դուք նայեցիք «գլխապտույտ» բառապաշարում տպագրության դիզայնի եւ սկզբունքների մասին, ապա կլիներ ինչ-որ բան կարդալ «այն տիպի հաջորդական տողերի միջեւ եղած հեռավորությունը»:

Առաջատարը վեբ դիզայնով

Թվային դիզայնի տերմինը շարունակում է կիրառել տեքստի տողերի միջեւ տարածությունը: Շատ ծրագրեր օգտագործում են այս հստակ տերմինը, չնայած, որ փաստացի առաջնորդը ակնհայտորեն չի օգտագործվում այդ ծրագրերում: Սա ավանդական նորարարությունների ձեւավորման նոր ձեւերի մեծ օրինակ է, թեեւ այդ սկզբունքի ճշգրիտ իրականացումը փոխվել է:

Երբ խոսքը վերաբերում է վեբ-դիզայնին, CSS- ի սեփականություն չկա «առաջատարի համար»: Փոխարենը, CSS- ի գույքը, որը կտարածվի տեքստի այս տեսողական ցուցադրությանը, կոչվում է գծի բարձրություն: Եթե ​​ցանկանում եք, որ ձեր տեքստը լրացուցիչ տարածություն ունենա տեքստի հորիզոնական տողերի միջեւ, ապա դուք կօգտագործեք այս հատկությունը: Օրինակ, ասեք, որ ցանկանում եք բարձրացնել գծի բարձրությունը ձեր կայքի

տարրի մեջ պարունակվող բոլոր պարբերությունների համար, կարող եք անել այնպես, ինչպես դա:

հիմնական p {line-height: 1.5; }

Սա այժմ 1,5 անգամ գերազանցում է նորմալ գծի բարձրությունը `հիմնված էջի լռելյայն տառաչափի վրա (որը սովորաբար 16px է):

Երբ օգտագործեք գծի բարձրությունը

Որպես մանրամասն վերը նշված գծի բարձրությունը հարմար է օգտագործելու տեքստի տեքստերի տողերը կամ տեքստերի այլ բլոկներում: Եթե ​​գծերի միջեւ շատ քիչ տարածություն կա, տեքստը կարող է դյուրագրգիռ եւ դժվարությամբ կարդալ հեռուստադիտողների համար ձեր կայքի համար: Նմանապես, եթե տողերը չափազանց հեռու են էջում, ընթերցման նորմալ հոսքը կդադարի եւ ընթերցողները խնդիրներ կունենան ձեր տեքստում այդ պատճառով: Ահա թե ինչու եք ուզում գտնել համապատասխան գծի գծի բարձրության միջակայքը: Կարող եք նաեւ փորձարկել ձեր դիզայնը փաստացի օգտագործողների հետ, իրենց կարծիքը էջի ընթերցման մասին :

Երբ չպետք է օգտագործեք գծի բարձրությունը

Մի շփոթեք գիծի բարձրությունը լիցքաթափման կամ ծածկույթների հետ, որոնք կօգտագործեք ձեր էջի դիզայնին, ներառյալ տողի վերնագրի կամ պարբերությունների տակ ավելացնելու համար: Այդ ընդմիջումը չի առաջացնում, եւ, հետեւաբար, այն չի կարգավորվում գծի բարձրության վրա:

Եթե ​​ցանկանում եք ավելացնել տիեզերք որոշակի տեքստային տարրերի տակ, ապա կօգտագործեք ծածկանյութեր կամ լցնում: Վերադառնալով նախորդ CSS օրինակին, մենք օգտագործել ենք, կարող ենք ավելացնել հետեւյալը.

հիմնական p {line-height: 1.5; margin-bottom: 24px; }

Սա դեռ կունենա 1,5 գծի բարձրություն, տեքստի տողերի միջեւ, մեր էջի պարբերության համար (<հիմնական> տարրերի մեջ գտնվողները): Այդ նույն կետերը կունենան նաեւ նրանցից յուրաքանչյուրի տակ 24 պիքսել հեռավորության տակ, թույլ տալով, որ տեսողական ընդմիջումները թույլ են տալիս ընթերցողներին հեշտությամբ բացահայտել մեկ պարբերությունից մյուսը եւ դարձնել հեշտությամբ կարդալ կայքը: Դուք կարող եք օգտագործել նաեւ լիցքաթափման գույքը այստեղ գտնվող ծածկի տեղում:

հիմնական p {line-height: 1.5; padding-bottom: 24px; }

Գրեթե բոլոր դեպքերում դա կցուցադրի նույնը, ինչ նախորդ CSS- ում:

Ասացեք, որ ցանկանում եք ընդգրկել տողերի տողերի տողերը, որոնք ընդգրկված են «ծառայություն-մենյու» դասի հետ, դուք կօգտագործեք ծալքեր կամ լրացնելով `դա չկատարելու գծի բարձրությունը: Այսպիսով, դա ճիշտ կլինի:

.services-menu li { Դուք միայն օգտագործում եք գծի բարձրությունը, եթե ցանկանում եք տեղադրել տեքստի ընդգրկույթը ցուցակի մեջ, իրերի համար, ենթադրելով, որ դրանք երկարատեւ տեքստեր էին, որոնք կարող էին առաջարկել տարբեր տողեր յուրաքանչյուր գնդակի համար: