Sunday, May 28, 2017

TEXT

Դաս 1.


Ուսումնասիրության համար կօգտագործենք մի փոքր տեքստ:

TEXT-ALIGN

text-align հատկության միջոցով մենք կարող ենք սահմանել հորիզոնական հավասարությունը տեքստի ինչ-ոչ մի էլեմենտի ներսում:
Հնարավոր արժեքներն են.


text-align: center;
text-align: justify;
text-align: left;
text-align: right;
text-align: inherit;

Վարժություն 1!

Փորձենք այս տարբերակը.
text-align: center;
text-align: justify;
text-align: left;
text-align: right;

Այժմ այս կոդերից որևէ մեկը, կամ բոլորը առանձին-առանձին գրեք գրատախտակի վրա և ստուգեք:

Դաս 2.


TEXT-ALIGN-LAST

text-align-last սա տալիս է հնարավորություն տեքստի վերջին տողի հորիզոնական դիրքը կարգավորել:
Հնարավոր արժեքներն են


text-align-last: auto;
text-align-last: left;
text-align-last: right;
text-align-last: center;
text-align-last: justify;
text-align-last: inherit;

Վարժություն 2!

Այժմ փորձիր այս օրինակները.
text-align-last: left;
text-align-last: right;
text-align-last: center;
text-align-last: justify;

Փորձիր օրինակները առանձին-առանձին գրատախտակի վրա:

Դաս 3.

TEXT-AUTOSPACE

text-autospace -ը հնարավորություն է տալիս սահմանել հեռավորության չափսը ideografic-գաղափարագրի և nonideographic-ոչ գաղափարագրի միջև:


Հնարավոր արժեքներն են.


text-autospace:none;
text-autospace:ideograph-alpha;
text-autospace:ideograph-numeric;
text-autospace:ideograph-parenthesis;
text-autospace:ideograph-space;

Վարժություն 3!

Try one of this examples!

Փորձելով կտեսնեք, որ էական ոչինչ չկատարվեց: Պատճառն այն է, որ տեքստը պետք է պարունակեր գաղափարագիր:


Դաս 4.

TEXT-DECORATION

text-decoration հատկանիշը բավականին կիրառական է: Սրա միջոցով տեքստին տալիս կամ չենք տալիս ոճավորում, փորձելով առանձին-առանձին Ձեզ համար ավելի հստակ կլինի: Սրանք հիմնական արժեքներն են.


text-decoration: blink;
text-decoration: line-through;
text-decoration: none;
text-decoration: overline;
text-decoration: underline;
text-decoration: inherit;

Վարժություն 4!

Փորձեք այս օրինակները.

text-decoration: blink;
text-decoration: line-through;
text-decoration: overline;
text-decoration: underline;

Ինչպես նախկինում, այս կոդերը փորձեք գրատախտակին:

Դաս 5.

TEXT-INDENT

text-indent-ի միջոցով սահմանում ենք տեքստի առաջին տողի չափսերը: Սակայն սա ենթադրում է հարաբերություն ինչ-որ մի էլեմենտի հետ:
Հնարավոր արժեքներն են.

text-indent: ;
text-indent: % ;
text-indent: inherit;

 

Վարժություն 5!

Try this examples!

Պատկերացնելու համար, ցավոք, մեզ պետք է block-ային էլեմենտ: Միայն տեքստի առկայությամբ ոչինչ չենք կարող նկատել:

text-indent: 20px;
text-indent: 150% ;
text-indent: 15px;
text-indent: 50% ;



Դաս 6.

TEXT-JUSTIFY

text-justify-ի միջոցով կարող ենք սահմանել տեքստի հավասարեցման ձևը, այն կդիտվի որպես block-level էլեմենտ:
Հնարավոր արժեքներն են.

text-justify: auto;
text-justify: distribute;
text-justify: distribute-all-lines;
text-justify: inter-cluster;
text-justify: inter-ideograph;
text-justify: inter-word;
text-justify: kashida;
text-justify: newspaper;

Վարժություն 6!

Փորձիր այս տարբերակներից մեկը:

text-justify: distribute-all-lines;
text-justify: inter-cluster;
text-justify: inter-ideograph;
text-justify: inter-word;
text-justify: kashida;
text-justify: newspaper;

Գրիր գրատախտակին: Սակայն նախապես ասեմ, որ ոչ մի փոփոխություն չեք նկատի, քանի որ դարձյալ պետք է բլոկային էլեմենտ:

Դաս 7.

TEXT-KASHIDA-SPACE

text-kashida-space - այսհատկությունը կիրառական է արաբերենի համար:
Հնարավոր արժեքներն են.


text-kashida-space: ; /*number*/
text-kashida-space: % ;
text-kashida-space: inherit;

Վարժություն 7!

Կարող եք փորձել, բայց ...

Անհրաժեշտ է արաբական տեքստ:

Բոլոր դեպքերում փորձեք:

Դաս 8.

TEXT-OVERFLOW

text-overflow -սակիրառում են block-level էլեմենտների համար:
Հնարավոր արժեքներն են.


text-overflow: clip;
text-overflow: ellipsis;

Վարժություն 8!

Կարելի էր փորձել, սակայն...

մեզ պետք է բլոկային էլեմենտ:

text-overflow: ellipsis;

Դաս 9.

TEXT-SHADOW

text-shadow- շատ կիրառական հատկություններից մեկն է, տալիս է ստվերի էֆեկտ:
Հնարավոր արժեքներն են.

text-shadow: none;
text-shadow: ; /*horiz length & vert length*/
text-shadow: #ffaaee;
text-shadow: inherit;

Վարժություն 9!

Փորձեք այս կոդերը.

text-shadow: red 8px 4px 2px; /*սահմանում ենք գույնը, ստվերի չափը և դիրքը*/

Փորձիր գրատախտակին:

Դաս 10.

TEXT-TRANSFORM

text-transform- տալիս է հնարավորություն ձևափոխելու տեքստային ֆոնտը՝ օրինակ այն դարձնել մեծատառ:
Հնարավոր արժեքներն են.


text-transform: capitalize;
text-transform: lowercase;
text-transform: none;
text-transform: uppercase;
text-transform: inherit;

Վարժություն 10!

Փորձեք այս կոդերը.

text-transform: capitalize;
text-transform: lowercase;
text-transform: none;
text-transform: uppercase;

Փորձելով գրատախտակին կտեսնեք ինչը ինչ է անում:

Դաս 11.

TEXT-UNDERLINE-POSITION

text-underline-position - սա կարող ենքկիրառել, եթե նախ սահմանել ենք text-decoration հատկություն:
Հնարավոր արժեքներն են.

text-underline-position: above;
text-underline-position: below;
text-underline-position: auto;
text-underline-position: auto-pos;


Վարժություն 11!

Փորձեք այս օրինակները.

text-decoration:underline;
text-underline-position: below;

Կարող եք պարզապես copy-paste-ով փորձել գրատախտակի վրա:

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.