فهرست جامع ویژگی های CSS
لیست کامل ویژگی های css + جدول صفات css
در این مقاله مرجع از سایت آموزی جهت استفاده بهتر شما همراهان گرامی قصد معرفی کلیه صفات کاربردی css براساس آخرین نسخه این زبان طراحی یعنی css3 را داریم.
شما در این مقاله مرجع با یک جدول کامل از لیست همه خصوصیات css اعم از صفات ورژن های قبلی css ، خواص منسوخ شده css و حتی کلیه صفات جدید css3 آشنا خواهید شد.
به همین منظور مطابق مقاله مرجع لیست کامل صفات HTML ، کلیه خواص قدیمی ، منسوخ شده و جدید css3 را در داخل یک جدول جامع به همراه توضیح کوتاهی از صفت در اختیار خواهید داشت.
همچنین از طریق لینک صفات مربوطه می توانید به برگه توضیحات کامل و جامع صفت css مورد نظر بروید و در مورد آن صفت اختصاصی تر بدانید.
لیست کامل تگ های css pdf
در انتهای این مقاله مرجع می توانید فایل pdf صفات css را نیز دانلود کرده و برای همیشه این جدول مرجع در دسترس شما عزیزان باشد.
لیست جدولی کامل تمام صفات کاربردی CSS به ترتیب حروف الفبای انگلیسی و بر اساس آخرین نسخه CSS3
ویژگی ها در css |
توضیح کوتاه و کاربرد ویژگی css |
---|---|
align-content |
ویژگی align-content برای یک عنصر نگهدارنده ( container ) که در داخل آن تگ ها یا عناصر داخلی قرار گرفته استفاده می شود. توسط این ویژگی عنصرهای داخلی که بیشتر از یک ردیف هستند در چند ردیف نسبت به محور عمود هم ترازسازی می شوند. |
align-items |
ویژگی align-item جهت هم ترازسازی تگ های داخلی یک عنصر نگهدارنده ( container ) نسبت به محور عمود در یک ردیف کاربرد دارد.
css و css3 |
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 |
توسط خاصیت bottom می توانیم فاصله از پایین را برای آن دسته از تگ های html که خصوصیت position را گرفته اند، از مبدا آنها تعیین نماییم. |
box-decoration-break |
توسط خاصیت box-decoration-break می توانیم ویژگی های دیگری از جمله background و padding و border و border-image و box-shadow و margin و clip را وقتی که تگ html اینلاین داخل آنها Fragment یا تکه تکه می شود، به چه طریقی در آن تگ html اینلاین تکه تکه شده اعمال بشوند. |
box-shadow |
از ویژگی box-shadow برای اضافه کردن سایه به یک تگ html یا یک باکس استفاده می شود. |
box-sizing |
توسط خاصیت box-sizing می توانیم روش اندازه دهی به یک تگ html را که بر اساس مدل قسمت بندی در حالت پیش فرضتعیین می شود، تغییر دهیم. |
break-after |
|
break-before |
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
break-inside |
|
caption-side |
توسط خاصیت caption-side می توانیم عنوان جدول html را که در داخل تگ table با تگ caption تعیین شده است را، جهت دهی کنیم. |
caret-color |
توسط خاصیت caret-color می توانیم رنگ نشانگر چشمک زنی که در تگ های قابل ویرایش ( دارای خصوصیت contenteditable ) و تگ هایی که ورودی می پذیرند همچون تگ input و تگ textarea تغییر دهیم. |
charset@ |
توسط خاصیت charset@ می توانیم کاراکترست را در زبان طراحی سی اس اس تعریف کنیم. و انکدینگ زبان مورد نظر را در زبان css مشخص می کنیم. |
clear |
ویژگی clear می تواند اطراف تگ html شناور را که با خاصیت float تعریف کردید، پاکسازی کند. در این حالت تگ های html دیگر به پایین تگ html شناور سقوط می کنند. |
clip |
با خصوصیت clip می توانیم مشکل بزرگ بودن تصاویر یا محتوایی که در محدوده تگ html با موقعیت absolute قرار نمی گیرند را حل کرده و به شکل مستطیل آنها را برش دهیم. |
color |
توسط خاصیت color می توانیم رنگ متن را در یک تگ html تعیین کنیم. |
column-count |
ویژگی column-count می تواند تعداد ستون ها را برای محتوای تگ html مورد نظر تعیین کند. |
column-fill |
ویژگی column-fill می تواند چیدمان ستون ها را برای محتوای تگ html مورد نظر از منظر ارتفاع تعیین کند. |
column-gap |
ویژگی column-gap می تواند فاصله بین ستون های محتوای تگ html مورد نظر را تعیین کند. |
column-rule |
ویژگی column-rule می تواند خطی بین ستون های محتوای تگ html مورد نظر جهت تشخیص بهتر فاصله بین ستون هاایجاد کند. |
column-rule-color |
ویژگی column-rule-color می تواند رنگ خطوط بین ستون های محتوای تگ html مورد نظر را جهت تشخیص بهتر فاصله بین ستون ها تعیین کند. |
column-rule-style |
ویژگی column-rule-style می تواند یک سبک یا استایل برای خطوط بین ستون های محتوای تگ html مورد نظر جهت تشخیص بهتر فاصله بین ستون ها تعیین کند.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
column-rule-width |
ویژگی column-rule-width می تواند ضخامت خطوط بین ستون های محتوای تگ html مورد نظر را جهت تشخیص بهتر فاصله بین ستون ها تعیین کند. |
column-span |
ویژگی column-span می تواند محدوده پوشش عنصری که در داخل تگی با محتوای ستونی قرار گرفته را در داخل ستون و یا در خارج از ستون تعیین کند. |
column-width |
ویژگی column-width می تواند عرض ستون ها را برای محتوای تگ html مورد نظر تعیین کند. |
columns |
ویژگی columns می تواند تعداد ستون ها و عرض ستون ها را برای محتوای تگ html مورد نظر تعیین کند. |
content |
خاصیت content همراه با عناصر کاذب before:: و after:: جهت تولید محتوا در قبل یا بعد تگ های html کاربرد دارد. |
counter-increment |
با استفاده از خصوصیت counter-increment می توانیم تعیین کنیم که شمارنده چندتا چندتا افزایش یا کاهش پیدا کند. |
counter-reset |
با استفاده از خصوصیت counter-reset می توانیم نام و تنظیم مجدد شمارنده در زبان طراحی سی اس اس را تعیین کنیم. |
cursor |
توسط خاصیت cursor می توانیم شکل ظاهری مکان نما یا نمایشگر موس را در زمانی که موس روی تگ html مورد نظر قرار می گیرد، تعیین نماییم. |
direction |
توسط خاصیت direction می توانیم جهت نوشتن را در یک تگ html تعیین کنیم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
display |
خصوصیت display در سی اس اس برای چگونگی نمایش و مشخص کردن چارچوب تگ های html به کار می رود. |
empty-cells |
توسط خاصیت empty-cells می توانیم تعیین کنیم که حاشیه یا border سلول های یک جدول html نمایش داده شود یا خیر. |
filter |
به کمک خاصیت filter در CSS3 می توانیم عناصر html را قبل از نمایش در صفحه وب به شیوه دلخواه خود پردازش و رندر نماییم. |
flex |
توسط خاصیت flex می توانیم آیتم ها یا تگ های html درون یک تگ container پدری ، با حالت Flexbox صفحه آرایی نماییم. |
flex-basis |
توسط خاصیت flex-basis می توانیم ارتفاع اولیه تگ های html که به صورت فلکس باکس صفحه آرایی می شوند، را تعیین کنیم. |
flex-direction |
توسط خاصیت flex-direction می توانیم آیتم ها یا تگ های html درون یک تگ container پدری ، که در حالت فلکس باکسصفحه آرایی می شوند را، چیدمان افقی یا عمودی نماییم. |
flex-flow |
توسط خاصیت flex-flow می توانیم آیتم ها یا تگ های html درون یک تگ container پدری ، که در حالت فلکس باکس صفحه آرایی می شوند را، چیدمان افقی یا عمودی نموده و یا آنها را کنار هم در یک خط و یا به خط بعدی منتقل نماییم. |
flex-grow |
توسط خاصیت flex-grow می توانیم عرض آیتم یا آیتم هایی که با حالت Flexbox درون یک تگ container پدری صفحه آرایی شدند را افزایش دهیم. |
flex-shrink |
توسط خاصیت flex-shrink می توانیم عرض آیتم یا آیتم هایی که با حالت Flexbox درون یک تگ container پدری صفحه آرایی شدند را کاهش دهیم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
flex-wrap |
توسط خاصیت flex-wrap می توانیم آیتم ها یا تگ های html درون یک تگ container پدری ، که در حالت فلکس باکس صفحه آرایی می شوند را، در یک خط کنار هم بیاوریم و یا به خط بعدی منتقل نماییم. |
float |
توسط خاصیت float می توانیم تگ یا تگ های html را به سمت راست یا چپ تگ نگهدارنده خود شناور کرده و یا هل دهیم. |
font |
توسط خاصیت font می توانیم برخی صفات فونت در زبان سی اس اس را بر روی یک تگ html مختصرنویسی نماییم. |
font-face@ |
توسط خاصیت font-face@ می توانیم فونت های دلخواه و سفارشی را در زبان سی اس اس تعریف کنیم. |
font-family |
توسط خاصیت font-family می توانیم اسم یک فونت را برای یک تگ html تعیین نماییم. |
font-feature-settings |
|
font-feature-values@ |
|
font-kerning |
توسط خاصیت font-kerning می توانیم فاصله بین حروف یک فونت را براساس مقدار font-kerning در مرورگر کاربر برای تگ html مورد نظر تعریف کنیم. |
font-language-override |
|
font-size |
توسط خاصیت font-size می توانیم اندازه یک فونت را بر روی یک تگ html تعریف نمود.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
font-size-adjust |
خصوصیت font-size-adjust به شما امکان کنترل بهتر اندازه فونت را می دهد زمانی که اولین فونت انتخاب شده در دسترس نیست. |
font-stretch |
توسط خاصیت font-stretch می توانیم اشکال مختلف یک فونت را براساس عرض کاراکترها بر روی تگ html مورد نظر انتخابکنیم. |
font-style |
توسط خاصیت font-style می توانیم استایل یک فونت استاندارد را به سبک ایتالیک ( خط کج ) ، مورب ( اریب ) و یا نرمال ( عادی ) بر روی یک تگ html تعریف نماییم. |
font-synthesis |
|
font-variant |
توسط خاصیت font-variant می توانیم تعیین کنیم که حروف بزرگ انگلیسی با اندازه کوچک تر نمایش داده شود. |
font-variant-alternates |
|
font-variant-caps |
|
font-variant-east-asian |
|
font-variant-ligatures |
|
font-variant-numeric |
|
font-variant-position |
|
font-weight |
توسط خاصیت font-weight می توانیم ضخامت یک فونت را که به وزن فونت نیز معروف می باشد، بر روی یک تگ html تعریف نماییم. |
grid |
توسط خاصیت grid می توانیم لیستی از شماره و عرض ردیف ها و ستون ها و چیدمان عناصر نام گذاری شده برای آیتم های گریدمشخص نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
grid-area |
توسط خاصیت grid-area می توانیم مکان و اندازه شروع و انتهای ردیف و ستون آیتم های گرید ( grade ) را مشخص نماییم. |
grid-auto-columns |
توسط خاصیت grid-auto-columns می توانیم عرض و ارتفاع ترک های ضمنی ستونی آیتم های گرید را مشخص نماییم. |
grid-auto-flow |
توسط خاصیت grid-auto-flow می توانیم مکان آیتم های گرید که به شکل واضح مشخص نشده اند را به صورت خودکار مشخص نماییم. |
grid-auto-rows |
توسط خاصیت grid-auto-rows می توانیم عرض و ارتفاع ترک های ضمنی ردیفی آیتم های گرید را مشخص نماییم. |
grid-column |
توسط خاصیت grid-column می توانیم یک شماره با span ( ترک ) و یا یک شماره خط جهت تعیین اندازه و شروع و انتهای ستون آیتم های گرید ( grade ) را مشخص نماییم. |
grid-column-end |
توسط خاصیت grid-column-end می توانیم اندازه خط ستون انتهای یک آیتم گرید را مشخص نماییم. |
grid-column-gap |
توسط خاصیت grid-column-gap می توانیم فاصله بین ستونی آیتم های گرید ( grade ) را مشخص نماییم. |
grid-column-start |
توسط خاصیت grid-column-start می توانیم اندازه خط ستون شروع یک آیتم گرید را مشخص نماییم. |
grid-gap |
توسط خاصیت grid-gap می توانیم فاصله بین ردیف و ستون آیتم های گرید ( grade ) را مشخص نماییم. |
grid-row |
توسط خاصیت grid-row می توانیم یک شماره با span ( ترک ) و یا یک شماره خط جهت تعیین اندازه و شروع و انتهای ردیف آیتم های گرید ( grade ) را مشخص نماییم. |
grid-row-end |
توسط خاصیت grid-row-end می توانیم اندازه خط ردیف انتهای یک آیتم گرید را مشخص نماییم. |
grid-row-gap |
توسط خاصیت grid-row-gap می توانیم فاصله بین ردیفی آیتم های گرید ( grade ) را مشخص نماییم. |
grid-row-start |
توسط خاصیت grid-row-start می توانیم اندازه خط ردیف شروع یک آیتم گرید را مشخص نماییم. |
grid-template |
توسط خاصیت grid-template می توانیم لیستی از شماره و عرض ردیف ها و ستون ها و چیدمان عناصر نام گذاری شده برای آیتم های گرید مشخص نماییم. |
grid-template-areas |
توسط خاصیت grid-template-areas می توانیم یک رشته ( string ) چیدمانی برای آیتم های گرید که توسط خصوصیت grid-area نام گذاری شده اند، تعیین نماییم. |
grid-template-columns |
توسط خاصیت grid-template-columns می توانیم لیستی از شماره و عرض ستون ها را برای آیتم های گرید مشخص نماییم. |
grid-template-rows |
توسط خاصیت grid-template-rows می توانیم لیستی از شماره و عرض ردیف ها را برای آیتم های گرید مشخص نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
hanging-punctuation |
|
height |
توسط خاصیت height می توانیم اندازه ارتفاع محتوا در تگ html مربوطه را مشخص نماییم. |
hyphens |
توسط خاصیت hyphens می توانیم در مرورگر یک خط تیره برای متونی که به خط بعدی می روند تعیین نماییم. |
image-rendering |
|
import@ |
توسط قانون کاربردی import@ می توانیم یک فایل سی اس اس را در فایل سی اس اس دیگر ادغام یا ترکیب نماییم. |
isolation |
توسط خاصیت isolation می توانیم گروهی از تگ های html را در مقابل آمیخته شدن با محتوای پشت سرشان ایزوله کنیم. |
justify-content |
به کمک ویژگی justify-content در CSS3 می توانیم عناصر داخلی را نسبت به محور اصلی ( main-axis ) ، هم ترازسازی کنیم. |
keyframes@ |
توسط قانون کاربردی keyframes@ می توانیم یک کد انیمیشن مشخص نماییم. این انیمیشن یک نوع تغییر شکل تدریجی در مجموعه ای از سبک های css به سبک های css دیگر هست. |
left |
توسط خاصیت left می توانیم فاصله از چپ را برای آن دسته از تگ های html که خصوصیت position را گرفته اند، از مبدا آنها تعیین نماییم. |
letter-spacing |
توسط خاصیت letter-spacing می توانیم فاصله بین حروف یک کلمه را بر روی یک تگ html تعریف نماییم. |
line-break |
|
line-height |
به کمک خاصیت line-height در CSS1 می توانیم ارتفاع ردیف های یک نوشته را درون یک تگ html مشخص کنیم. |
list-style |
به کمک خاصیت list-style می توانیم تصویر ، مکان و نوع نشانه گر آیتم های لیست را درون تگ های html مشخص کنیم. |
list-style-image |
به کمک خاصیت list-style-image در CSS1 می توانیم تصویری برای نشانه گر آیتم های یک لیست درون یک تگ html مشخص کنیم. |
list-style-position |
به کمک خاصیت list-style-position می توانیم مکان نشانه گر آیتم های لیست را در خارج یا داخل باکس اصلی یک تگ html مشخص کنیم. |
list-style-type |
به کمک خاصیت list-style-type می توانیم نوع نشانه گر آیتم های لیست را در یک تگ html مشخص کنیم. |
margin |
خصوصیت margin ، فضای بیرونی بین تگ های html را تعیین می کند. |
margin-bottom |
توسط خاصیت margin-bottom می توانیم عرض فضای خارجی پایین تگ html را مشخص نماییم. |
margin-left |
توسط خاصیت margin-left می توانیم عرض فضای خارجی چپ تگ html را مشخص نماییم. |
margin-right |
توسط خاصیت margin-right می توانیم عرض فضای خارجی راست تگ html را مشخص نماییم. |
margin-top |
توسط خاصیت margin-top می توانیم عرض فضای خارجی بالا در تگ html را مشخص نماییم. |
max-height |
توسط خاصیت max-height می توانیم یک ارتفاع حداکثر را برای محتوا در تگ html مربوطه مشخص نماییم. |
max-width |
توسط خاصیت max-width می توانیم یک عرض حداکثر را برای محتوا در تگ html مربوطه مشخص نماییم. |
media@ |
|
min-height |
توسط خاصیت min-height می توانیم یک ارتفاع حداقل را برای محتوا در تگ html مربوطه مشخص نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
min-width |
توسط خاصیت min-width می توانیم یک عرض حداقل را برای محتوا در تگ html مربوطه مشخص نماییم. |
mix-blend-mode |
به کمک خاصیت mix-blend-mode در CSS3 می توانیم مشخص کنیم چگونه محتوای یک عنصر html را با پس زمینه والد مستقیم آن ترکیب شود. |
object-fit |
به کمک خاصیت object-fit می توانیم برای محتوای عناصر با منبعی خارج از محدوده css یا ( Replacement Elements) ابعاد مشخصی تعیین کنیم. |
object-position |
به کمک خاصیت object-position می توانیم محتوای عناصر با منبعی خارج از محدوده css یا ( Replacement Elements ) را ترازبندی کنیم. |
opacity |
به کمک خاصیت opacity می توانیم درجه شفافیت یک تگ html را تعیین کنیم. ما می توانیم میزان شفافیت عنصر html را تا حدناپدید شدن عنصر کنترل نماییم. |
order |
به کمک خاصیت order می توانیم ترتیب نمایش عنصرهای داخلی آیتم های فلکس را بدون تغییر در ساختار HTML عوض کنیم. |
orphans |
|
outline |
به کمک خاصیت outline می توانیم رنگ ، عرض ، اندازه و سبک یا استایل خط بیرونی عنصر html را تعیین نماییم. |
outline-color |
به کمک خاصیت outline-color می توانیم رنگ خط بیرونی عنصر html را تعیین نماییم. |
outline-offset |
به کمک خاصیت outline-offset می توانیم فاصله بین خط بیرونی ( outline ) و border عنصر html را تعیین نماییم. |
outline-style |
به کمک خاصیت outline-style می توانیم سبک یا استایل خط بیرونی عنصر html را تعیین نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
outline-width |
به کمک خاصیت outline-width می توانیم عرض خط بیرونی عنصر html را تعیین نماییم. |
overflow |
به کمک خاصیت overflow می توانیم تعیین نماییم، محتوای عنصر html که خارج از مرز های تگ اچ تی ام ال ( بالا ، پایین ، راست و چپ ) قرار گرفته است، نمایش داده شود یا خیر. |
overflow-wrap |
|
overflow-x |
به کمک خاصیت overflow-x می توانیم نحوه نمایش محتوای عناصر html که خارج از مرز چپ و راست افتادند، را تعیین نماییم. |
overflow-y |
به کمک خاصیت overflow-y می توانیم نحوه نمایش محتوای عناصر html که خارج از مرز بالا و پایین افتادند، را تعیین نماییم. |
padding |
توسط خاصیت padding می توانیم عرض فضای داخلی عنصر html را در چهار جهت اصلی ( بالا ، پایین ، راست ، چپ ) مشخص نماییم. |
padding-bottom |
توسط خاصیت padding-bottom می توانیم عرض فضای داخلی پایین تگ html را مشخص نماییم. |
padding-left |
توسط خاصیت padding-left می توانیم عرض فضای داخلی چپ تگ html را مشخص نماییم. |
padding-right |
توسط خاصیت padding-right می توانیم عرض فضای داخلی راست تگ html را مشخص نماییم. |
padding-top |
توسط خاصیت padding-top می توانیم عرض فضای داخلی بالا در عنصر html را مشخص نماییم.
لیست کامل ویژگی های CSS |
page-break-after |
به کمک خاصیت page-break-after می توانیم رفتار مربوط به شکسته شدن صفحه ( رفتن به صفحه بعد ) را بعد از یک تگ html تنظیم نماییم. |
page-break-before |
به کمک خاصیت page-break-before می توانیم رفتار مربوط به شکسته شدن صفحه ( رفتن به صفحه بعد ) را قبل از یک تگ html تنظیم نماییم.
لیست کامل ویژگی های CSS |
page-break-inside |
به کمک خاصیت page-break-inside می توانیم رفتار مربوط به شکسته شدن صفحه ( رفتن به صفحه بعد ) را در داخل یک تگ html تنظیم نماییم. |
perspective |
به کمک خاصیت perspective در CSS3 می توانیم یک فضای سه بعدی برای عنصر html مورد نظر فعال نماییم. |
perspective-origin |
به کمک خاصیت perspective-origin در CSS3 می توانیم مشخص نماییم که عنصر html سه بعدی ، روی محور x و y از کجا شروع شود. |
pointer-events |
به کمک خاصیت pointer-events می توانیم رویداد های نشانگر موس را در عناصر html کنترل نماییم. |
position |
توسط خاصیت position می توانیم موقعیت مکانی یک تگ html را در جهات مختلف تعیین نماییم. |
quotes |
به کمک خاصیت quotes می توانیم با ایجاد مقادیر رشته ای ، نوع یا علامت کوتیشن را که درون یک عنصر html مشخص نماییم. |
resize |
به کمک خاصیت resize می توانیم اندازه تگ های html که قابلیت تغییر اندازه توسط کاربر دارند را تغییر دهیم. |
right |
توسط خاصیت right می توانیم فاصله از راست را برای آن دسته از تگ های html که خصوصیت position را گرفته اند، از مبدا آنها تعیین نماییم. |
scroll-behavior |
به کمک خاصیت scroll-behavior می توانیم مشخص کنیم که وقتی یک کاربر روی یک پیوند در یک باکس قابل اسکرول کلیک می کند، آیا به جای یک پرش مستقیم، می تواند، نوع حرکت اسکرول را در تگ html مربوطه تحریک کند. |
tab-size |
به کمک خاصیت tab-size می توانیم عرض کاراکتر تب را در برخی عناصر html مشخص نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
table-layout |
به کمک خاصیت table-layout در CSS2 می توانیم الگوریتم یا چارت ستون های یک جدول html را از حالت پیش فرض تغییر دهیم. |
text-align |
به کمک خاصیت text-align می توانیم نحوه چیدمان متن عنصر اچ تی ام ال را درون سند html در موقعیت راست ، چپ ، وسط و یا تراز راست و چپ مشخص نماییم. |
text-align-last |
توسط خاصیت text-align-last در CSS3 می توانیم موقعیت آخرین خط متن یک تگ html را تعیین نماییم. |
text-combine-upright |
|
text-decoration |
به کمک خاصیت text-decoration می توانیم رنگ ، موقعیت و سبک خط را بر ( رو ، بالا و یا پایین متن نوشته ) در تگ htmlمربوطه تعیین نماییم. |
text-decoration-color |
به کمک خاصیت text-decoration-color می توانیم رنگ خطی که بوسیله این خصوصیت بر روی یک نوشته ، بالای نوشته و یا پایین نوشته یک تگ html قرار گرفته را تعیین نماییم. |
text-decoration-line |
به کمک خاصیت text-decoration-line می توانیم موقعیت خط متن را بر ( روی متن نوشته ، بالای متن نوشته و یا پایین متن نوشته ) در تگ html مربوطه تعیین نماییم. |
text-decoration-style |
به کمک خاصیت text-decoration-style می توانیم سبک یا استایل خط متن یک نوشته که توسط خصوصیت text-decoration در بالای متن نوشته ، پایین متن نوشته یا بر روی متن نوشته در یک تگ html ایجاد می شود، را تعیین نماییم. |
text-indent |
به کمک خاصیت text-indent می توانیم میزان تورفتگی نوشته در تگ html را درون سند html تعیین نماییم. |
text-justify |
به کمک خاصیت text-justify می توانیم وضعیت متن تراز شده در یک تگ اچ تی ام ال را تعیین نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
text-orientation |
|
text-overflow |
به کمک خاصیت text-overflow می توانیم تا زمانی که متن از عنصر html نگهدارنده اش سرریز می شود، کاربر را با خبر کنیم. |
text-shadow |
از خاصیت text-shadow در CSS3 ، برای سایه دار کردن متن و نوشته در صفحات وب استفاده می شود. |
text-transform |
از خاصیت word-spacing در CSS3 جهت تعیین حروف کوچک یا بزرگ درون متن یک تگ html استفاده می شود. |
text-underline-position |
|
top |
توسط خاصیت top می توانیم فاصله از بالا را برای آن دسته از تگ های html که خصوصیت position را گرفته اند، از مبدا آنها تعیین نماییم. |
transform |
به کمک خاصیت transform در CSS3 می توانیم منجر به تغییر شکل یا تغییر مکان یا تغییر وضعیت یک عنصر html در فضای سه بعدی یا دوبعدی شویم. |
transform-origin |
به کمک خاصیت transform-origin در CSS3 می توانیم مبدا مختصات تغییر شکل یا انیمیشن را در تگ html تعیین نماییم. |
transform-style |
به کمک خاصیت transform-style در CSS3 می توانیم تعیین کنیم که فرزندان یک تگ html پدر در حالت سه بعدی یا دوبعدی قرار گیرند. |
transition |
خاصیت transition در css3 جهت تعیین افکت تغییر یا ترانزیشن در تگ html به کار می رود. |
transition-delay |
به کمک خاصیت transition-delay در CSS3 می توانیم مدت زمانی برای مکث یا تاخیر در اجرای افکت تغییر یا transition در یک تگ html تعیین نماییم. |
transition-duration |
به کمک خاصیت transition-duration در CSS3 می توانیم مدت زمانی برای اجرای افکت تغییر یا transition در یک تگ html تعیین نماییم. |
transition-property |
به کمک خاصیت transition-property در CSS3 می توانیم مدت زمانی برای اجرای افکت تغییر یا transition در یک تگ htmlتعیین نماییم. |
transition-timing-function |
به کمک خاصیت white-space در CSS3 می توانیم سرعت افکت تغییر یا سرعت ترانزیشن را در تگ html که برایش ترانزیشنتعیین نمودیم، تغییر دهیم. |
unicode-bidi |
به کمک خاصیت unicode-bidi در CSS2 می توانیم متن تگ های html که با دو زبان مختلف در دو جهت مختلف هستند را کنترلکنیم. |
user-select |
به کمک خاصیت user-select می توانیم انتخاب یا عدم انتخاب متون داخل تگ های html را توسط کاربر کنترل نماییم. |
vertical-align |
به کمک خاصیت vertical-align در CSS1 می توانیم عناصردرون خطی یا اینلاین html را در راستای عمود ترازبندی نماییم.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
visibility |
به کمک خاصیت visibility در CSS2 می توانیم قابلیت نمایانی یا عدم نمایانی یک تگ html را تعیین تعیین نماییم. |
white-space |
به کمک خاصیت white-space در CSS1 می توانیم فضاهای خالی متن یا space ها یا tab های متن را درون یک تگ htmlمدیریت کنیم. |
widows |
|
width |
توسط خاصیت width می توانیم اندازه عرض محتوا در تگ html مربوطه را مشخص نماییم. |
word-break |
به کمک خاصیت word-break می توانیم مشخص کنیم که یک کلمه از محتوای تگ html مربوطه در انتهای خط با شکست به خط بعدی مواجه شود یا خیر. |
word-spacing |
از خاصیت word-spacing در CSS3 جهت تعیین فاصله بین کلمات متن در یک تگ اچ تی ام ال استفاده می شود. |
word-wrap |
به کمک خاصیت word-wrap در CSS3 می توانیم کلماتی با طول بلند که در یک خط جا نمی شوند، را شکسته و در خط بعدینمایش دهیم. |
writing-mode |
از خاصیت writing-mode در CSS3 جهت تغییر جهت نوشته از بالا به پایین در یک تگ html کاربرد دارد. |
z-index |
از ویژگی z-index جهت تعیین ترتیب عناصر html زمانی که روی هم قرار می گیرند، استفاده می شود.
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 |
تدریس جامع و پروژه محور CSS در دوره کدنویسی فرانت اند
یادگیری زبان استایل گذاری css از اهمیت بالایی در طراحی سایت فرانت اند برخوردار است. ما در سایت آموزی با آموزش css براساس پروژه های عملی کلیه دستورات css و کدنویسی css را به دانشجویان یاد می دهیم.
با در اختیار داشتن نمونه کد css نمی توانید نتیجه لازم را بگیرید. شما بایستی در عمل نحوه کاربرد این کدها را در پروژه های مختلف ببینید.
در صورتیکه قصد دارید تمام ویژگی های css را در قالب پروژه های عملی یاد بگیرید، می توانید در دوره جامع کدنویسی سایت شاخه فرانت اند حتما ثبت نام کنید.
برای متخصص شدن در طراحی سایت فروشگاهی با وردپرس روی لینک زیر کلیک کن و تو دوره ثبت نام کن:
دوره فوق حرفه ای طراحی سایت فروشگاهی با وردپرس پروژه محور
در کاملترین دوره تخصصی آموزش طراحی سایت فرانت اند ایران مطابق با استانداردهای W3C آمریکا ثبت نام کن :
دوره فوق حرفه ای آموزش طراحی سایت با HTML5 و CSS3 و jQuery
پیوندهای مهم و کاربردی
تگ های جدید HTML5 در سایت آموزی
تگ های منسوخ شده HTML5 در سایت آموزی
تگ های block level و inline level در سایت آموزی
صفات تگ های HTML در سایت آموزی
لیست کامل ویژگی های CSS | صفات CSS | صفات CSS3 – اختصاصی سایت آموزی
درباره سایت آموزی
علیرضا ابراهیمی - بنیانگذار وبسایت آموزشی سایت آموزی ، 8 سال سابقه فعالیت حرفه ای در زمینه طراحی سایت ، سئو ، سابقه تدریس اغلب زبان های برنامه نویسی تحت وب ، محقق و تحلیلگر ساختارهای توسعه دهنده وب
نوشته های بیشتر از سایت آموزیمطالب زیر را حتما مطالعه کنید
1 دیدگاه
به گفتگوی ما بپیوندید و دیدگاه خود را با ما در میان بگذارید.
با عرض سلام
تشکر میکنم از قرار دادن این مطلب، مثل cheatsheet فارسی میشه ازش استفاده کرد. با اجازه شما از این مطلب با ذکر منبع در وبلاگ شخصی خودم به آدرس emok.ir استفاده میکنم. موفق و سلامت باشید. یا حق