تمام ویژگی های CSS و کاربرد آن ها

در این مطلب سعی میکنم تمام ویژگی های CSS رو به شما معرفی کنم.
البته همه ی این ویژگی ها در CSS استفاده نمیشود.

لیست ویژگی های CSS:

Layout

Width
پهنا

Height
ارتفاء

Max-width
حداکثر پهنا

Max-height
حداکثر ارتفاء

Min-width
حداقل پهنا

Min-height
حداقل ارتفاء

Margin
فاصله بیرونی شی با دیگر اشیا

Margin-top
فاصله بالایی شی

Margin-bottom
فاصله پایینی شی

Margin-left
فاصله از سمت چپ شی

Margin-right
فاصله از سمت راست شی

Padding
فاصله داخلی شی با کادر دور همان شی

Padding-top
فاصله داخلی شی از بالا

Padding-bottom
فاصله داخلی شی از پایین

Padding-left
فاصله داخلی شی از سمت چپ

Padding-right
فاصله داخلی شی از سمت راست

Position
محل قرار گیری شی در صفحه

Top
محل قرار گیری شی در صفحه از بالا

Bottom
محل قرار گیری شی در صفحه از پایین

Left
محل قرار گیری شی در صفحه از چپ

Right
محل قرار گیری شی در صفحه از راست

Visibility
نمایش یا عدم نمایش یک شی

Opacity
میزان شفافیت یکشی

Float
ردیف کردن شی از سمت راست یا چپ

Clear
از جریان دادن عناصر در کنار عنصری که شناور شده است جلوگیری کند

Overflow-x
تعیین می کند که محتوایی که از مرزهای چپ و راست عنصر خارج می شود, نمایش داده شود یا نه. و همچنین چگونگی نمایش را نیز تعیین می کند

Overflow-y
یین می کند که محتوایی که از مرزهای بالا و پایین عنصر خارج می شود, نمایش داده شود یا نه. و همچنین چگونگی نمایش را نیز تعیین می کند

Overflow
تعیین می کند که محتوایی که از مرزهای عنصر خارج می شود, نمایش داده شود یا نه. و همچنین چگونگی نمایش را نیز تعیین می کند

z-index
برای تعیین ترتیب عناصر زمانی که روی هم قرار می گیرند, استفاده می شود. یعنی مشخص می کند که عنصر, رو یا زیر عنصر یا عناصر دیگر قرار بگیرد

Display
نوع نمایش

Text

Color
رنگ متن

Font-family
نوع قلم

Font-style
مورب یا نرمال بودن متن

Font-variant
نوشتن متن با حروف بزرگ در اندازه کوچک

Font-size
اندازه قلم

Font-weight
ضخامت قلم

Text-align
چپ چین ، راست چین ، وسط چین بودن متن

Line-height
ارتفاع خط

Text-decoration
زیر خط ، بالا خط ، روی خط

Text-indent
میزان تورفتگی

Text-shadow
سایه متن

Text-transform
تبدیل متن به حروف کوچک و بزرگ

Letter-space
تعیین فاصله حروف

Word-spacing
تعیین فاصله کلمات

White-space
فاصله کلمات

Vertical-align
موقعیت عممودی شی

Font
تمامی تنظیمات مربوط به قلم

@font-face
اختصاص دادن یک نام به یک فونت

Border

Border-collapse
ایجاد فاصله یا از بین بردن فاصله بین کادر دور ایشا

Border-spacing
فاصله بین خطوط کادر دور

Border-color
رنگ کادر دور

Border-width
پهنای کادر دور

Border-style
نوع کادر دور

Border-radius
شعاع گوشه های کادر دور اشیا

Background

Background-color
رنگ پیس زمینه

Background-image
عکس پس زمینه

Background-position
محل قرار گیری پس زمینه

Background-size
اندازه پس زمینه

Background-clip
بریدن تصویر پس زمینه

Background-repeat
تکرار یا عدم تکرار عکس پس زمینه

Background-origin
قرار دادن تصویر پس زمینه در موقعیت خاص

Background-attachment
ثابت یا متحرک بودن عکس پس زمینه

Box-shadow
ایجاد سایه

Box-direction
جهت نمایش باکس

Background
تمام ویژگی های پس زمینه

ویژگی های دیگر

List-style-position
محل قرار گیری شکل یا شماره های لیست

List-style-image
تصویر به جای شکل در لیست

List-style-type
نوع شکل یا شماره های لیست

@keyframes
ایجاد انیمیشن

Animation
تعریف ویژگی های انیمیشن یک شی

Animation-duration
مدت اجرای انیمیشن

Animation-name
نام انیمیشن

Animation-delay
بعد از چه تاخیری زمانی انیمیشن اجرا شود

Animation-timing-function
سرعت اجرا انیمیشن

Animation-direction
مسیر حرکت انیمیشن

Animation-iteration-count
تعداد اجرا انیمیشن

clip
برش در یک شی

Caption-side
محل قرار گیری برچسب جدول

Column-gap
برای ایجاد فضای خالی بین دو ستون

Column-count
تعداد ستون در یک شی

Column-rule-color
رنگ خط بین ستون ها

Column-rule
ضخامت ، نوع خط و رنگ بین ستون ها

Column-rule-width
ضخامت خط بین دو ستون

Column-rule-style
نوع خط بین ستون ها

Columns
تعداد ستون ها و پهنای ستون ها

Column-width
پهنای ستون ها

Cursor
تغییر شکل اشاره گر ماوس

Word-warp
شکستن خط و انتقال ان به خط بعدی

Outline
کادر بیرونی هر شی

Direction
مسیر نوشتن متن

Outline-color
رنگ کادر بیرونی هر شی

Empty-cells
نمایش یا عدم نمایش سلول های خالی

Outline-width
ضخامت کادر بیرونی

Outline-style
نوع کادر بیرونی

Transform
تغییر شکل دادن شی

Table-layout
تعیین الگوریتم استفاده از جدول

Transition-property
تغییر خصوصیت ها موقع انتقال

Transform-origin
تغییر شکل بر اساس نقطه خاص

Transition-timing-function
شتاب حرکت

Transition-duration
مدت اجرای انتقال

Transition-delay
میزان تاخیر تا اجرای انتقال

امیدوارم این مقاله برای شما جذاب بوده باشه. فقط تمرین کردن یادتون نره. موفق باشید.