CSS Հատկություններ

Այստեղ պատկերված են CSS հատկություններն ըստ խմբերի: Ձախ կողմում հատկություններն են, իսկ աջ կողմում՝ նրանց բացատրությունները:

- նոր է CSS3-ում

Գույն

color	Հատկանշում է տեքստի գույնը:
opacity	Հատկանշում է տարրի անթափանցիկության աստիճանը:

Ֆոն և եզրագիծ

background	Հատկանշում է ֆոնային բոլոր հատկությունները կրճատ գրելաձևով:
background-attachment	Հատկանշում է, արդյո՞ք ֆոնային պատկերը ֆիքսված է, թե պտտվում է էջի մնացած մասի հետ:
background-clip	Հատկանշում է ֆոնի նկարչական տարածքը:
background-color	Հատկանշում է տարրի ֆոնային գույնը:
background-image	Հատկանշում է ֆոնային պատկեր տարրի համար:
background-origin	Հատկանշում է ֆոնային պատկերի դիրքավորման տարածքը:
background-position	Հատկանշում է ֆոնային պատկերի նախնական դիրքավորումը:
background-repeat	Հատկանշում է, թե ինչպես պետք է կրկնվի ֆոնային պատկերը:
background-size	Հատկանշում է ֆոնային պատկերի չափսը:
border	Հատկանշում է եզրագծային բոլոր հատկությունները կրճատ գրելաձևով:
border-bottom	Հատկանշում է ստորին եզրագծի բոլոր հատկությունները կրճատ գրելաձևով:
border-bottom-color	Հատկանշում է ստորին եզրագծի գույնը:
border-bottom-left-radius	Հատկանշում է ստորին եզրագծի ձախ անկյան կորությունը:
border-bottom-right-radius	Հատկանշում է ստորին եզրագծի աջ անկյան կորությունը:
border-bottom-style	Հատկանշում է ստորին եզրագծի ոճը:
border-bottom-width	Հատկանշում է ստորին եզրագծի լայնությունը:
border-color	Հատկանշում է չորս եզրագծերի գույնը:
border-image	Հատկանշում է եզրագծային պատկերի բոլոր հատկությունները կրճատ գրելաձևով:
border-image-outset	Հատկանշում է չափսը, որքանով որ եզրագծային պատկերի տարածքը դուրս է գալիս արկղի եզրագզից:
border-image-repeat	Հատկանշում է, արդյո՞ք եզրագծային պատկերը պետք է կրկնվի, կլորանա կամ ձգվի:
border-image-slice	Հատկանշում է եզրագծային պատկերի ներքին խառնուրդը (offset):
border-image-source	Հատկանշում է որպես եզրագիծ օգտագործվող պատկեր:
border-image-width	Հատկանշում է եզրագծային պատկերի լայնությունները:
border-left	Հատկանշում է ձախ եզրագծի բոլոր հատկությունները կրճատ գրելաձևով:
border-left-color	Հատկանշում է ձախ եզրագծի գույնը:
border-left-style	Հատկանշում է ձախ եզրագծի ոճը:
border-left-width	Հատկանշում է ձախ եզրագծի լայնությունը:
border-radius	Հատկանշում է չորս եզրագծերի անկյունների կորությունները կրճատ գրելաձևով:
border-right	Հատկանշում է աջ եզրագծի բոլոր հատկությունները կրճատ գրելաձևով:
border-right-color	Հատկանշում է աջ եզրագծի գույնը:
border-right-style	Հատկանշում է աջ եզրագծի ոճը:
border-right-width	Հատկանշում է աջ եզրագծի լայնությունը:
border-style	Հատկանշում է չորս եզրագծերի ոճը:
border-top	Հատկանշում է վերին եզրագծի բոլոր հատկությունները կրճատ գրելաձևով:
border-top-color	Հատկանշում է վերին եզրագծի գույնը:
border-top-left-radius	Հատկանշում է վերին եզրագծի ձախ անկյան կորությունը:
border-top-right-radius	Հատկանշում է վերին եզրագծի աջ անկյան կորությունը:
border-top-style	Հատկանշում է վերին եզրագծի ոճը:
border-top-width	Հատկանշում է վերին եզրագծի լայնությունը:
border-width	Հատկանշում է չորս եզրագծերի լայնությունը:
box-shadow	Կցորդում է շողք արկղին:

Արկղի բազային

bottom	Հատկանշում է դիրքավորված տարրի ստորին դիրքավորումը:
clear	Հատկանշում է, թե տարրի որ կողմերում այլ լողացող տարրեր չեն թույլատրվում:
clip	Կտրում է բացարձակապես դիրքավորված տարրը:
display	Հատկանշում է, թե տարրն ինչպես պետք է պատկերվի:
float	Հատկանշում է, արդյո՞ք արկղը պետք է լողա, թե ոչ:
height	Հատկանշում է տարրի բարձրությունը:
left	Հատկանշում է դիրքավորված տարրի ձախ դիրքավորումը:
overflow	Հատկանշում է, թե ինչ պետք է լինի, երբ պարունակությունը լրացնում է տարրի արկղը:
overflow-x	Հատկանշում է, արդյո՞ք կտրել պարունակության ձախ/աջ եզրերը, երբ պարունակությունը լրացնում է տարրի պարունակության տարածքը:
overflow-y	Հատկանշում է, արդյո՞ք կտրել պարունակության վերին/ստորին եզրերը, երբ պարունակությունը լրացնում է տարրի պարունակության տարածքը, թե ոչ:
padding	Հատկանշում է լիցքային բոլոր հատկությունները կրճատ գրելաձևով:
padding-bottom	Հատկանշում է տարրի ստորին լիցքը:
padding-left	Հատկանշում է տարրի ձախ լիցքը:
padding-right	Հատկանշում է տարրի աջ լիցքը:
padding-top	Հատկանշում է տարրի վերին լիցքը:
position	Հատկանշում է տարրի համար օգտագործվող դիրքավորման տեսակը:
right	Հատկանշում է դիրքավորված տարրի աջ դիրքավորումը:
top	Հատկանշում է դիրքավորված տարրի վերին դիրքավորումը:
vertical-align	Հատկանշում է տարրի ուղղահայաց հավասարեցումը:
visibility	Հատկանշում է, արդյո՞ք տարրը տեսանելի է, թե ոչ:
width	Հատկանշում է տարրի լայնությունը:
z-index	Հատկանշում է դիրքավորված տարրի շերտային հերթականությունը:

Ճկվող արկղի նախագծում

align-content	Հատկանշում է հավասարեցում գծերի միջև, ճկվող կոնտեյների ներսում, երբ տարրերը չեն զբաղեցնում ողջ հասանելի տարածքը:
align-items	Հատկանշում է հավասարեցում տարրերի միջև ճկվող կոնտեյների ներսում:
align-self	Հատկանշում է հավասարեցում ընտրված տարրերի համար ճկվող կոնտեյների ներսում:
flex	Հատկանշում է տարրի երկարությունը՝ հարաբերված մնացածի հետ:
flex-basis	Հատկանշում է ճկվող տարրի սկզբնական երկարությունը:
flex-direction	Հատկանշում է ճկվող տարրերի ուղղությունը:
flex-flow	Հատկանշում է flex-direction և flex-wrap հատկույունները կրճատ գրելաձևով:
flex-grow	Հատկանշում է, թե որքան պետք է աճի տարրը՝ հարաբերված մնացածի հետ:
flex-shrink	Հատկանշում է, թե ինչպես տարրը պետք է նեղանա՝ հարաբերված մնացածի հետ:
flex-wrap	Հատկանշում է, արդյո՞ք ճկվող տարրերը պետք է տեղափոխվեն, թե ոչ:
justify-content	Հատկանշում է հավասարեցում տարրերի միջև, ճկվող կոնտեյների ներսում, երբ տարրերը չեն ձբաղեցնում ողջ հասանելի տարածքը:
margin	Հատկանշում է սահմանային բոլոր հատկությունները կրճատ գրելաձևով:
margin-bottom	Հատկանշում է տարրի ստորին սահմանը:
margin-left	Հատկանշում է տարրի ձախ սահմանը:
margin-right	Հատկանշում է տարրի աջ սահմանը:
margin-top	Հատկանշում է տարրի վերին սահմանը:
max-height	Հատկանշում է տարրի մաքսիմալ բարձրությունը:
max-width	Հատկանշում է տարրի մաքսիմալ լայնությունը:
min-height	Հատկանշում է տարրի մինիմալ բարձրությունը:
min-width	Հատկանշում է տարրի մինիմալ լայնությունը:
order	Հատկանշում է ճկվող տարրի հերթականությունը՝ հարաբերված մնացածի հետ:

Տեքստ

letter-spacing	Ավելացնում կամ նվազեցնում է տարածությունը սիմվոլների միջև տեքստում:
line-height	Հատկանշում է տողի բարձրությունը:
text-align	Հատկանշում է տեքստի հորիզոնական հավասարեցումը:
text-indent	Հատկանշում է առաջին տողի հեռավորությունը տեքստում:
text-transform	Կառավարում է տեքստի կապիտալիզացիան:
user-select	Կառավարում է նշված տեքստի կամ այլ տարրելի պահելաձևը էջում:
white-space	Հատկանշում է, թե ինչպես է սպիտակ տարածությունը կարգավորվում տարրի ներսում:
word-break	Հատկանշում է տողադարձի կանոններ ոչ CJK սքրիփթների համար:
word-spacing	Ավելացնում կամ նվազեցնում է տարածությունը բառերի միջև տեքստում:
word-wrap	Թույլատրում է երկար, չկոտրվող բառերին կոտրվել և տեղափոխվել հաջորդ տող:

Տեքստի դեկորացիա

text-decoration	Ավելացնում է դեկորացիա տեքստին:
text-shadow	Ավելացնում է շողք տեքստին:

Տառատեսակ

font	Հատկանշում է տառատեսակային բոլոր հատկությունները կրճատ գրելաձևով:
font-family	Հատկանշում է տառատեսակի ընտանիք տեքստի համար:
font-size	Հատկանշում է տեքստի տառատեսակի չափսը:
font-style	Հատկանշում է տառատեսակի ոճ տեքստի համար:
font-variant	Հատկանշում է, արդյո՞ք տեքստը պետք է պատկերվի small-caps տառատեսակով, թե ոչ:
font-weight	Հատկանշում է տառատեսակի հաստությունը:

Գրելու եղանակներ

direction	Հատկանշում է տեքստի գրելու ուղղությունը:
unicode-bidi	Օգտագործվում է direction հատկության հետ միասին հատկանշելու համար, արդյո՞ք տեքստը պետք է փոփոխվի բազմակի լեզուներ սպասարկելու համար փաստաթղթում, թե ոչ:

Աղյուսակ

border-collapse	Հատկանշում է, արդյո՞ք պետք է աղյուսակի եզրագծերը միացված լինեն, թե ոչ:
border-spacing	Հատկանշում է հարևան արկղերի միջև հեռավորությունը:
caption-side	Հատկանշում է աղյուսակի վերնագրի դիրքավորումը:
empty-cells	Հատկանշում է, արդյո՞ք պետք է պատկերվեն եզրագծեր և ֆոն աղյուսակի դատարկ արկղերում, թե ոչ:
table-layout	Հատկանշում է աղյուսակի համար օգտագործվող նախագծման ալգորիթմ:

Ցանկեր և հաշվիչներ

counter-increment	Ավելացնում է մեկ կամ ավելի հաշվիչներ:
counter-reset	Ստեղծում կամ զրոյացնում է մեկ կամ ավելի հաշվիչներ:
list-style	Հատկանշում է ցանկի բոլոր հատկությունները կրճատ գրելաձևով:
list-style-image	Հատկանշում է պատկեր, որպես ցանկի տարրի նշագիր:
list-style-position	Հատկանշում է, արդյո՞ք ցանկի տարրերի նշագրերը պետք է հայտնվեն պարունակության հոսքի ներսում, թե դրսում:
list-style-type	Հատկանշում է ցանկի տարրերի նշագրման տեսակը:

Անիմացիա

animation	Հատկանշում է անիմացիոն բոլոր հատկությունները կրճատ գրելաձևով, բացի animation-play-state հատկությունից:
animation-delay	Հատկանշում է, թե երբ պետք է անիմացիան սկսի:
animation-direction	Հատկանշում է, արդյո՞ք անիմացիան պետք է խաղա հակառակ յուրաքանչյուր ցիկլում, թե ոչ:
animation-duration	Հատկանշում է, թե քանի վայրկյան կամ միլիվայրկյան է անհրաժեշտ անիմացիային մեկ ցիկլ ավարտելու համար:
animation-fill-mode	Հատկանշում է, թե ինչ արժեքներ են կիրառվում անիմացիայի կողմից նրա կատարման ժամանակից դուրս:
animation-iteration-count	Հատկանշում է, թե քանի անգամ անիմացիան պետք է խաղա:
animation-name	Հատկանշում է անվանում @keyframes անիմացիայի համար:
animation-play-state	Հատկանշում է, արդյո՞ք անիմացիան պետք է սկսի, թե կանգնեցված լինի:
animation-timing-function	Հատկանշում է անիմացիայի կորության արագությունը:

Փոխակերպում

backface-visibility	Հատկանշում է, արդյո՞ք տարրը պետք է լինի տեսանելի, երբ այն էկրանի տեսադաշտում չէ:
perspective	Հատկանշում է հեռանկար, թե ինպես են 3D տարրերը դիտվում:
perspective-origin	Հատկանշում է 3D տարրերի ստորին դիրքավորումը:
transform	Հատկանշում է 2D կամ 3D փոխակերպում տարրին:
transform-origin	Թույլ է տալիս փոփոխել դիրքավորումը փոխակերպվող տարրերում:
transform-style	Հատկանշում է, թե ինչես են գեներացվում ներդրված տարրերը 3D տարածությունում:

Անցումներ

transition	Հատկանշում է չորս անցումային հատկությունները կրճատ գրելաձևով:
transition-delay	Հատկանշում է, թե երբ պետք է անցումային ազդեցությունը սկսի:
transition-duration	Հատկանշում է, թե քանի վայրկյան կամ միլիվայրկյան է հարկավոր անցումային ազդեցության ավարտի համար:
transition-property	Հատկանշում է այն CSS հատկության անվանումը, որի համար նախատեսված է անցումային ազդեցությունը:
transition-timing-function	Հատկանշում է անցումային ազդեցության կորության արագությունը:

Բազային օգտվողի ինտերֆեյս

box-sizing	Հատկանշում է, թե ինչ չափսեր պետք է ներառվեն (լայնություն և բարձրություն):
content	Օգտագործվում է :before և :after կեղծ սելեքթորների հետ, գեներացված պարունակություն ներդնելու համար:
cursor	Հատկանշում է մկնիկի ցուցադրվող սլաքի/կուրսորի տեսակը:
outline	Հատկանշում է ուրվագծի բոլոր հատկությունները կրճատ գրելաձևով:
outline-color	Հատկանշում է ուրվագծի գույնը:
outline-offset	Հատկանշում է ուրվագծի և եզրագծի միջև հեռավորությունը:
outline-style	Հատկանշում է ուրվագծի ոճը:
outline-width	Հատկանշում է ուրվագծի լայնությունը:
resize	Հատկանշում է, արդյո՞ք տարրի չափսերը փոփոխվող են օգտվողի կողմից, թե ոչ:
text-overflow	Հատկանշում է, թե ինչ պետք է տեղի ունենա, երբ տեքստը լրացնում է պարունակիչ տարրը:

Բազմասյունակային նախագծում

column-count	Հատկանշում է սյունակների թիվը, որին պետք է բաժանվի տարրը:
column-gap	Հատկանշում է սյունակների միջև հեռավորությունը:
column-rule	Հատկանշում է սյունակային կանոնների բոլոր հատկությունները կրճատ գրելաձևով:
column-rule-color	Հատկանշում է սյունակների միջև կանոնի գույնը:
column-rule-style	Հատկանշում է սյունակների միջև կանոնի ոճը:
column-rule-width	Հատկանշում է սյունակների միջև կանոնի լայնությունը:
column-span	Հատկանշում է, թե քանի սյունակների պետք է բաժանվի տարրը:
column-width	Հատկանշում է սյունակների լայնությունը:
columns	Հատկանշում է column-width և column-count հատկությունները կրճատ գրելաձևով:

Արտաբերված մեդիա

page-break-after	Հատկանշում է էջի ընդհատման պահելաձևը տարրից հետո:
page-break-before	Հատկանշում է էջի ընդհատման պահելաձևը տարրից առաջ:
page-break-inside	Հատկանշում է էջի ընդհատման պահելաձևը տարրի ներսում:

Արտաբերված մեդիայի գեներացված պարունակություն

quotes

Հատկանշում է մեջբերման նշագրման տեսակը ներդրված/ներկառուցված մեջբերումների համար:

@-Կանոն

@font-face	Հատկանշում է կանոն, որը թույլ է տալիս վեբ կայքերին ներբեռնել և օգտագործել web-safe տառատեսակներից բացի այլ տառատեսակներ:
@keyframes	Հատկանշում է անիմացիա:
@media	Այս կանոնի միջոցով դուք կարող եք գրել տարբեր CSS կոդ տարբեր մեդիա տեսակների համար:

Այլ

!important	Սահմանում է ավելի կարևոր նշանակություն ունեցող կանոն:
linear-gradient	Գրադիենտները թույլ են տալիս ցուցադրել հարթ փոխանցումներ երկու կամ ավելի հատկանշված գույների միջև:
radial-gradient	Շառավղային գրադիենտը սահմանվում է իր կենտրոնից: