لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

در این مقاله مرجع از سایت آموزی جهت استفاده بهتر شما همراهان گرامی قصد معرفی کلیه صفات کاربردی css براساس آخرین نسخه این زبان طراحی یعنی css3 را داریم.

شما در این مقاله مرجع با یک جدول کامل از لیست همه خصوصیات css اعم از صفات ورژن های قبلی css ، خواص منسوخ شده css و حتی کلیه صفات جدید css3 آشنا خواهید شد.

به همین منظور مطابق مقاله مرجع لیست کامل صفات HTML ، کلیه خواص قدیمی ، منسوخ شده و جدید css3 را در داخل یک جدول جامع به همراه توضیح کوتاهی از صفت در اختیار خواهید داشت.

همچنین از طریق لینک صفات مربوطه می توانید به برگه توضیحات کامل و جامع صفت css مورد نظر بروید و در مورد آن صفت اختصاصی تر بدانید.

لیست کامل ویژگی های CSS | لیست صفات CSS | صفات CSS3

 لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

لیست کامل تمام صفات کاربردی CSS به ترتیب حروف الفبای انگلیسی و بر اساس آخرین نسخه CSS3

 ویژگی ها در css

توضیح کوتاه و کاربرد ویژگی css 

align-content

ویژگی align-content برای یک عنصر نگهدارنده ( container ) که در داخل آن تگ ها یا عناصر داخلی قرار گرفته استفاده می شود. توسط این ویژگی عنصرهای داخلی که بیشتر از یک ردیف هستند در چند ردیف نسبت به محور عمود هم ترازسازی می شوند.

align-items

ویژگی align-item جهت هم ترازسازی تگ های داخلی یک عنصر نگهدارنده ( container ) نسبت به محور عمود در یک ردیف کاربرد دارد.

align-self

ویژگی align-self منجر به هم ترازسازی یک تگ داخلی html که درون تگ نگهدارنده ( container ) قرار گرفته کاربرد دارد. 

all

ویژگی all کلیه خصوصیات css در تگ و یا تگ های html به جز صفات direction و unicode-bidi که جهت متن را مشخص می کنند، را به حالت initial و inherit بازنشانی یا ریست می کند.

animation

توسط خاصیت animation می توانید برخی صفات انیمیشن را درون یک تگ html از طریق همین خصوصیت مقداردهی و خلاصه نویسیکنید.

animation-delay

توسط خاصیت animation-delay می توانید برای یک تگ html ، اجرای انیمیشن را به تاخیر بیندازد.

animation-direction

توسط خاصیت animation-direction می توانید جهت گیری انیمیشن را درون یک تگ html تعیین کنید

animation-duration

توسط خاصیت animation-duration می توانید برای یک تگ html ، مدت زمان چرخه یک انیمیشن را مشخص نمایید.

animation-fill-mode

خاصیت animation-fill-mode می تواند قبل از شروع اجرای انیمیشن یا پس از پایان اجرای انیمیشن درون تگ html مورد نظر ، یک سبک یا استایل ایجاد کند.

animation-iteration-count

خاصیت animation-iteration-count جهت تعیین تعداد دفعات تکرار شدن انیمیشن درون یک تگ html کاربرد دارد.

animation-name

خاصیت animation-name جهت تعیین یک یا چند نام برای انیمیشن هایی که با دستور keyframe@ ساخته شده اند، برای یک تگ html کاربرد دارد.

animation-play-state

توسط خاصیت animation-play-state می توانید برای یک تگ html ، چرخه یک انیمیشن را متوقف کنید یا به حرکت در آورید.

animation-timing-function

خاصیت animation-timing-function ، منحنی سرعت یک انیمیشن درون یک تگ html را مشخص می کند.

backface-visibility

خاصیت backface-visibility تعیین می کند زمانی که تگ html در فضای سه بعدی توسط ویژگی transform حرکت داده می شود، توسط بیننده پشت آن قابل مشاهده باشد یا خیر.

background

توسط خاصیت background ، می توانیم چندین ویژگی دیگر را برای مدیریت پس زمینه در css به صورت مقادیر ترکیبی تعریف نماییم.

background-attachment

با استفاده از خاصیت background-attachment می توانید تنظیم نمایید اگر صفحه وب شما Scroll دارد، تصویر پس زمینه در اسکرول به بالا و پایین در جای خود ثابت بماند یا خیر.

background-blend-mode

برای تعیین حالت آمیختگی رنگ در لایه های مختلف پس زمینه یک تگ html استفاده می شود.

background-clip

توسط خاصیت background-clip می توانیم تعیین کنیم که پس زمینه تگ html در کدام ناحیه و یا ناحیه ها قرار بگیرد.

background-color

توسط خاصیت background-color می توانیم یک رنگ پس زمینه برای یک تگ html تعیین کنیم.

background-image

توسط خاصیت background-image ، می توان یک یا چند تصویر روی هم را به عنوان پس زمینه تگ html قرار داد.

background-origin

توسط خاصیت background-origin ، می توانیم تعیین کنیم که شروع ترسیم پس زمینه تگ html در کدام ناحیه باشد.

background-position

توسط خاصیت background-position ، مکان یک پس زمینه بر روی تگ html را می توانیم تعیین نماییم.

background-repeat

توسط خاصیت background-repeat می توان تعیین کرد که تصویر تکرار شود یا نه و یا اینکه چگونه تکرار شود.

background-size

از خاصیت background-size برای تعیین اندازه تصویر پس زمینه یک تگ html استفاده می شود.

border

توسط خاصیت border می توانید سه مقدار ضخامت ، استایل و رنگ در حاشیه یا border را در یک تگ html تعیین نمایید.

border-bottom

توسط خاصیت border-bottom می توانید یک حاشیه یا border در قسمت پایینی تگ html مربوطه تعیین کنید.

border-bottom-color

توسط خاصیت border-bottom-color می توانید رنگ در حاشیه پایینی یا رنگ در border پایینی را در تگ html مربوطه تعیین نمایید.

border-bottom-left-radius

توسط خاصیت border-bottom-left-radius می توانیم گوشه سمت چپ و پایینی یک تگ html را گرد کنیم.

border-bottom-right-radius

توسط خاصیت border-bottom-right-radius می توانیم گوشه سمت راست و پایینی یک تگ html را گرد کنیم.

border-bottom-style

توسط خاصیت border-bottom-style می توانید استایل حاشیه پایینی و یا استایل border پایینی را در تگ html مربوطه تعیین نمایید.

border-bottom-width

توسط خاصیت border-bottom-width می توانید مقدار ضخامت در حاشیه پایینی یا مقدار ضخامت در border پایینی را در تگ html مربوطه تعیین نمایید.

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

border-collapse

توسط خاصیت border-collapse می توانیم لبه های دوخطی یک جدول html را به لبه های یک خطی و مجزا در جدول html تبدیل نماییم.

border-color

توسط خاصیت border-color می توانیم رنگ در حاشیه یا رنگ در border را در تگ html مربوطه تعیین نماییم.

border-image

خاصیت border-image اجازه می دهد تا یک تصویر را برای حاشیه اطراف یک تگ html مشخص کنیم.

border-image-outset

توسط خاصیت border-image-outset می توانیم حاشیه تصویری را در خارج از سطح یک تگ html گسترش دهیم.

border-image-repeat

توسط خاصیت border-image-repeat می توانیم چگونگی تغییر سایز و چینش تکه های حاشیه تصویری را در یک تگ htmlتعیین کنیم.

border-image-slice

توسط خاصیت border-image-slice می توانیم تصویری که به عنوان حاشیه تگ html تعیین شده است را به 9 قسمت تقسیم کنیم.

border-image-source

توسط خاصیت border-image-source می توانیم آدرس تصویری که در حاشیه یک تگ html ، جای می گیرد را تعیین کنیم.

border-image-width

توسط خاصیت border-image-width می توانیم اندازه تکه های حاشیه تصویری در یک تگ html را با مقدار دهی بزرگ یا کوچک کنیم.

border-left

توسط خاصیت border-left می توانید سه مقدار ضخامت ، استایل و رنگ در حاشیه چپ یا border چپ را در یک تگ html تعیین نمایید.

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

border-left-color

توسط خاصیت border-left-color می توانیم رنگ حاشیه چپ یا رنگ border چپ را در یک عنصر html تعیین نماییم.

border-left-style

توسط خاصیت border-left-style می توانیم استایل حاشیه چپ یا استایل border چپ یک تگ html را تعیین می نماییم.

border-left-width

توسط خاصیت border-left-width می توانیم ضخامت حاشیه چپ یا ضخامت border چپ یک تگ html را تعیین می نماییم.

border-radius

توسط خاصیت border-radius می توانیم گوشه های بالا ، پایین ، راست و چپ یک تگ html را گرد کنیم.

border-right

توسط خاصیت border-right می توانید سه مقدار ضخامت ، استایل و رنگ در حاشیه راست یا border راست را در یک تگ html تعیین نمایید.

border-right-color

توسط خاصیت border-right-color می توانیم رنگ حاشیه راست یا رنگ border راست را در یک عنصر html تعیین نماییم.

border-right-style

توسط خاصیت border-right-style می توانیم استایل حاشیه راست یا استایل border راست یک تگ html را تعیین می نماییم.

border-right-width

توسط خاصیت border-right-width می توانیم ضخامت حاشیه راست یا ضخامت border راست یک تگ html را تعیین می نماییم.

border-spacing

توسط خاصیت border-spacing می توانیم یک فاصله مشخص بین سلول های یک جدول html که با تگ table تعریف شده است تعیین نماییم.

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

border-style

توسط خاصیت border-style می توانیم استایل حاشیه یا استایل border یک تگ html را تعیین می نماییم.

border-top

توسط خاصیت border-top می توانید سه مقدار ضخامت ، استایل و رنگ در حاشیه بالا یا border بالا را در یک تگ html تعیین نمایید.

border-top-color

توسط خاصیت border-top-color می توانیم رنگ حاشیه بالا یا رنگ border بالا را در یک عنصر html تعیین نماییم.

border-top-left-radius

توسط خاصیت border-top-left-radius می توانیم گوشه سمت چپ و بالایی یک تگ html را گرد کنیم.

border-top-right-radius

توسط خاصیت border-top-right-radius می توانیم گوشه سمت راست و بالایی یک تگ html را گرد کنیم.

border-top-style

توسط خاصیت border-top-style می توانیم استایل حاشیه بالا یا استایل border بالا یک تگ html را تعیین می نماییم.

border-top-width

توسط خاصیت border-top-width می توانیم ضخامت حاشیه بالا یا ضخامت border بالا یک تگ html را تعیین می نماییم.

border-width

توسط خاصیت border-width می توانیم ضخامت حاشیه یا ضخامت border یک تگ html را تعیین می نماییم.

bottom

box-decoration-break

box-shadow

box-sizing

توسط خاصیت box-sizing می توانیم روش اندازه دهی به یک تگ html را که بر اساس مدل قسمت بندی در حالت پیش فرضتعیین می شود، تغییر دهیم.

break-after

break-before

break-inside

caption-side

توسط خاصیت caption-side می توانیم عنوان جدول html را که در داخل تگ table با تگ caption تعیین شده است را، جهت دهی کنیم.

caret-color

charset@

clear

clip

color

column-count

column-fill

column-gap

column-rule

column-rule-color

column-rule-style

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

column-rule-width

column-span

column-width

columns

content

counter-increment

counter-reset

cursor

direction

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

display

empty-cells

filter

flex

flex-basis

flex-direction

flex-flow

flex-grow

flex-shrink

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

flex-wrap

float

font

font-face@

font-family

font-feature-settings

font-feature-values@

font-kerning

font-language-override

font-size

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

font-size-adjust

font-stretch

font-style

font-synthesis

font-variant

font-variant-alternates

font-variant-caps

font-variant-east-asian

font-variant-ligatures

font-variant-numeric

font-variant-position

font-weight

grid

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

grid-area

grid-auto-columns

grid-auto-flow

grid-auto-rows

grid-column

grid-column-end

grid-column-gap

grid-column-start

grid-gap

grid-row

grid-row-end

grid-row-gap

grid-row-start

grid-template

grid-template-areas

grid-template-columns

grid-template-rows

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

hanging-punctuation

height

hyphens

image-rendering

import@

isolation

justify-content

keyframes@

left

letter-spacing

line-break

line-height

list-style

list-style-image

list-style-position

list-style-type

margin

margin-bottom

margin-left

margin-right

margin-top

max-height

max-width

media@

min-height

min-width

mix-blend-mode

object-fit

opacity

order

orphans

outline

outline-color

outline-offset

outline-style

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

outline-width

overflow

overflow-wrap

overflow-x

overflow-y

padding

padding-bottom

padding-left

padding-right

padding-top

page-break-after

page-break-before

page-break-inside

perspective

perspective-origin

pointer-events

position

quotes

resize

right

scroll-behavior

tab-size

table-layout

text-align

text-align-last

text-combine-upright

text-decoration

text-decoration-color

text-decoration-line

text-decoration-style

text-indent

text-justify

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

text-orientation

text-overflow

text-shadow

text-transform

text-underline-position

top

transform

transform-origin

transform-style

transition

transition-delay

transition-duration

transition-property

transition-timing-function

unicode-bidi

user-select

vertical-align

visibility

white-space

widows

width

word-break

word-spacing

word-wrap

writing-mode

z-index

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3
آموزش css | بک گراند | آموزش تایپوگرافی با CSS3 | آموزش کاربردی CSS

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3

پیوندهای مهم و کاربردی

تگ های HTML در سایت آموزی

تگ های جدید HTML5 در سایت آموزی

تگ های منسوخ شده HTML5 در سایت آموزی

تگ های block level و inline level در سایت آموزی

صفات تگ های HTML در سایت آموزی

تگ های HTML در W3school

صفات CSS در W3schools

لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 – اختصاصی سایت آموزی