مرجع کامل خصوصیت های CSS
مرجع کامل خصوصیت های CSS
در زیر، تمام خصوصیت های CSS، دسته بندی شده اند، لطفاً برای مشاهده خصوصیت های مربوط به هر گروه روی آن کلیک نمایید:
- Animation
- Background
- Border و outline
- Box
- Color
- Content Paged Media
- Dimension
- Flexible Box
- Font
- Generated content
- Grid
- Hyperlink
- List
- Margin
- Multi-column
- Padding
- Paged Media
- Positioning
- Speech
- Table
- Text
- 2D/3D Transform
- Transition
- User-interface
ستون "CSS" در جداول زیر، نسخه CSS ای که این خصوصیت در آن تعریف شده است را نشان می دهد. (CSS1، CSS2، CSS3)
خصوصیت های Animation (انیمیشن)
| خصوصیت | توضیحات | CSS |
|---|---|---|
| @keyframes | انیمیشن را مشخص می کند. | 3 |
| animation |
از خصوصیت animation می توانید برای مختصر نویسی خصوصیت های زیر به جز خصوصیت animation-play-state استفاده نمایید. |
3 |
| animation-delay |
زمان شروع انیمیشن را مشخص می کند. مقدار پیشفرض 0 است. |
3 |
| animation-direction | اگر تعداد تکرار انیمیشن بیش از 1 بار باشد، این خصوصیت سیکل تناوب انیمیشن را مشخص می کند. (مقدار alternate انیمیشن را به صورت عکس تکرار می کند) | 3 |
| animation-duration | زمان اجرای انیمیشن به ثانیه یا میلی ثانیه، مقدار پیشفرض 0 است. | 3 |
| animation-fill-mode | مقادیری که انیمیشن خارج از زمان اجرا می گیرد را مشخص می کند. | 3 |
| animation-iteration-count | تعداد دفعاتی که انیمیشن اجرا می شود را مشخص می کند. مقدار پیشفرض 1 است. (مقدار infinite انیمیشن را تا بینهایت تکرار خواهد کرد) | 3 |
| animation-name | نام انیمیشن که در قانون keyframes@ ذکر شده است را مشخص می کند. | 3 |
| animation-timing-function | نحوه پردازش انیمیشن در طول یک سیکل را توضیح می دهد. مقدار پیشفرض "ease" است. | 3 |
| animation-play-state | توقف یا اجرای انیمیشن را مشخص می کند. مقدار پیشفرض "running" است. | 3 |
خصوصیت های Background
| خصوصیت | توضیحات | CSS |
|---|---|---|
| background | از خصوصیت background می توانید برای مختصر نویسی خصوصیت های مربوط به پس زمینه استفاده نمایید. | 1 |
| background-attachment | مکان عکس پس زمینه با Scroll خوردن صفحه حفظ شود یا نه. | 1 |
| background-color | رنگ پس زمینه یک عنصر را تنظیم می کند. | 1 |
| background-image | عکس های پس زمینه را تنظیم می کند. | 1 |
| background-position | شروع مکان قرارگیری عکس پس زمینه را تنظیم می کند. | 1 |
| background-repeat | چگونگی تکرار عکس پس زمینه را تنظیم می کند. | 1 |
| background-clip | ناحیه رنگ آمیزی پس زمینه را مشخص می کند. | 3 |
| background-origin | ناحیه قرار گیری عکس پس زمینه را مشخص می کند. (تصویر پس زمینه می تواند در قسمت محتوی (content-box)، لبه (border-box) و یا مکان (padding-box) قرار گیرد) | 3 |
| background-size | اندازه تصویر پس زمینه را تنظیم می کند. | 3 |
خصوصیت های Border و Outline
| خصوصیت | توضیحات | CSS |
|---|---|---|
| border |
تنظیمات تمام خصوصیت ها در یک تخصیص. |
1 |
| border-bottom | با استفاده از خصوصیت border-bottom، می توانید در یک مرحله تمام خصوصیت های لبه پایینی را تنظیم نمایید. | 1 |
| border-bottom-color | color لبه پایینی را مشخص می کند. | 1 |
| border-bottom-style | style لبه پایینی را مشخص می کند. | 1 |
| border-bottom-width | width لبه پایینی را مشخص می کند. | 1 |
| border-color | color لبه ها را مشخص می کند. | 1 |
| border-left | با استفاده از خصوصیت مختصر border-left، می توانید تمام خصوصیت های لبه سمت چپ را در یک اعلان، تنظیم نمایید. | 1 |
| border-left-color | color لبه سمت چپ را مشخص می کند. | 1 |
| border-left-style | style لبه سمت چپ را مشخص می کند. | 1 |
| border-left-width | width لبه سمت چپ را مشخص می کند. | 1 |
| border-right | با استفاده از خصوصیت مختصر border-right، می توانید در یک مرحله تمام خصوصیت های لبه سمت راست را تنظیم نمایید. | 1 |
| border-right-color | color لبه سمت راست را مشخص می کند. | 1 |
| border-right-style | Style لبه سمت راست را مشخص می کند. | 1 |
| border-right-width | width لبه سمت راست را مشخص می کند. | 1 |
| border-style | style لبه ها رامشخص می کند. | 1 |
| border-top | با استفاده از خصوصیت مختصر border-top، می توانید در یک مرحله تمام خصوصیت های لبه بالایی را تنظیم نمایید. | 1 |
| border-top-color | color لبه بالایی را مشخص می کند. | 1 |
| border-top-style | style لبه بالایی را مشخص می کند. | 1 |
| border-top-width | width لبه بالایی را مشخص می کند. | 1 |
| border-width | width لبه ها را مشخص می کند. | 1 |
| outline | فرم مختصر شده outline تمام خصوصیت های outline را در یک تخصیص تنظیم می کند. | 2 |
| outline-color | رنگ outline را مشخص می کند. | 2 |
| outline-style | استایل outline را مشخص می کند. | 2 |
| outline-width | ضخامت outline را مشخص می کند. | 2 |
| border-bottom-left-radius | شکل لبه در گوشه پایین سمت چپ را مشخص می کند. | 3 |
| border-bottom-right-radius | شکل لبه در گوشه پایین سمت راست را مشخص می کند. | 3 |
| border-image | با استفاده از خصوصیت مختصر border-image، می توانید در یک مرحله خصوصیت های *-border-image را مشخص کرد. | 3 |
| border-image-outset | 3 | |
| border-image-repeat | با استفاده از خصوصیت border-image-repeat می توانید نحوه ی نمایش تصویر در ناحیه border را تعیین نمایید. | 3 |
| border-image-slice | با استفاده از خصوصیت border-image-slice، می توانید حاشیه داخلی image-border را مشخص نمایید. | 3 |
| border-image-source | با استفاده از خصوصیت border-image-source می توانید از یک عکس به جای استایل های border که توسط خصوصیات border-style داده می شود استفاده کنید | 3 |
| border-image-width | با استفاده از خصوصیت border-image-width می توانید اندازه ی پهنای (عرض) حاشیه ی عکس را تعیین کنید. | 3 |
| border-radius | با استفاده از خصوصیت مختصر border-radius، می توانید چهار خصوصیت *-border-radius را در یک مرحله تنظیم نمایید. | 3 |
| border-top-left-radius | با استفاده از خصوصیت border-top-left-radius، می توانید شکل لبه در گوشه بالا سمت چپ را تعیین نمایید. | 3 |
| border-top-right-radius | با استفاده از خصوصیت border-top-right-radius، می توانید شکل لبه در گوشه بالا سمت راست را تعیین نمایید. | 3 |
| box-decoration-break | 3 | |
| box-shadow | با استفاده از خاصیت box-shadow می تواین یک یا چند سایه به box داد. | 3 |
خصوصیت های Box
| خصوصیت | توضیحات | CSS |
|---|---|---|
| overflow-x | با استفاده از خصوصیت overflow-x می توان مشخص کرد هنگامی که محتوا از لبه سمت چپ یا راست سرریز می شود، چه اتفاقی رخ دهد. | 3 |
| overflow-y | با استفاده از خصوصیت overflow-y می توان مشخص کرد هنگامی که محتوا از لبه بالایی یا پایینی سرریز می شود، چه اتفاقی رخ دهد. | 3 |
| overflow-style | با استفاده از خصوصیت می توان روش scroll شدن یک عنصر را هنگامی که سرریز می کند، مشخص کرد. | 3 |
| rotation | خصوصیت rotation یک عنصر block را حول نقطه ای که توسط خصوصیت rotation-point مشخص می شود، در جهت خلاف عقربه های ساعت می چرخاند. | 3 |
| rotation-point | خصوصیت rotation-point یک زوج عدد است که یک نقطه را به عنوان افست از لبه بالایی گوشه چپ مشخص می کند. در حقیقت چرخش حول این نقطه صورت می گیرد. | 3 |
خصوصیت های color
| خصوصیت | توضیحات | CSS |
|---|---|---|
| color-profile | اجازه می دهد منبع پروفایل رنگ غیر از پروفایل پیش فرض انتخاب شود. | 3 |
| opacity | با استفاده از خصوصیت opacity می توان میزان شفافیت یک عنصر را مشخص کرد. | 3 |
| rendering-intent | اجازه تنظیم خصوصیت rendering intent را در منبع پروفایل رنگ به غیر از مقدار پیش فرض می دهد. | 3 |
خصوصیت های Dimension
| خصوصیت | توضیحات | CSS |
|---|---|---|
| height | با استفاده از خصوصیت height می توان ارتفاع عناصر را تنظیم کرد. | 1 |
| max-height | استفاده از خصوصیت می توان حداکثر ارتفاع یک عنصر را مشخص کرد. | 2 |
| max-width | با استفاده از خصوصیت max-width می توان حداکثر عرض یک عنصر را مشخص کرد. | 2 |
| min-height | با استفاده از خصوصیت min-height می توان حداقل ارتفاع یک عنصر را مشخص کرد. | 2 |
| min-width | با استفاده از خصوصیت min-width می توان حداقل عرض یک عنصر را مشخص کرد. | 2 |
| width | تمام مرورگرهای اصلی، خصوصیت width را پشتیبانی می کنند. | 1 |
خصوصیت های Flexible Box
| خصوصیت | توضیحات | CSS |
|---|---|---|
| box-align | با استفاده از خصوصیت box-align می توان نحوه ترازبندی عناصر داخل یک box را مشخص کرد. | 3 |
| box-direction | با استفاده از خاصیت box-direction، جهت چینش فرزندان یک عنصر box را می توان مشخص کرد. | 3 |
| box-flex | با استفاده از خاصیت box-flex می توان مشخص نمود که عناصر فرزند دارای سایز انعطاف پذیر یا انعطاف ناپذیر باشند. | 3 |
| box-flex-group | با استفاده از خاصیت box-flexible-group عناصر انعطاف پذیر را به یک گروه flex اختصاص می دهیم. | 3 |
| box-lines | با استفاده از خاصیت box-lines مشخص می کنیم هنگامی که فضای یک عنصر از فضای box والدش بیشتر شد، این عنصر به خط بعدی برود یا خیر. | 3 |
| box-ordinal-group | با استفاده از خاصیت box-ordinal-group ترتیب نمایش فرزندان یک box را می توان مشخص کرد. | 3 |
| box-orient | با استفاده از خصوصیت box-orient می توان مشخص کرد که فرزندان یک عنصر عمودی یا افقی چیدمان شوند. | 3 |
| box-pack | با استفاده از خاصیت box-pack می توان مشخص کرد که فرزندان یک box هنگامی که سایز box از سایز فرزندان بیشتر است در کجا قرار گیرند. | 3 |
خصوصیت های Font
| خصوصیت | توضیحات | CSS |
|---|---|---|
| font | با استفاده از خاصیت مختصر شده font، می توانیم تمام ویژگی های مربوط به فونت را در یک تخصیص، تنظیم کنیم. | 1 |
| font-family | نام فونت را تنظیم می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-family مراجعه فرمایید | 1 |
| font-size | اندازه یک فونت و فاصله بین خطوط را مشخص می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-size و line-height مراجعه فرمایید. | 1 |
| font-style | Style یک فونت را تنظیم می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-style مراجعه فرمایید. | 1 |
| font-variant | کوچک یا بزرگ بودن حروف را مشخص می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-variantمراجعه فرمایید. | 1 |
| font-weight | ضخامت یک فونت را تنظیم می کند. برای اطلاعات بیشتر و مشاهده مقادیر ممکن به font-weight مراجعه فرمایید. | 1 |
| @font-face | با استفاده از از قانون font-face@، می توانید هر فونتی را که می خواهید استفاده نمایید. فقط کافی است در قانون font-face@ ابتدا یک نام برای فونت خود مشخص نمایید (مثلاً myFirstFont) و سپس آنرا به فایل فونتی که قبلاً روی سرور آپلود کرده اید هدایت کنید. | 3 |
| font-size-adjust | با استفاده از خاصیت font-size-adjust می توانیم هنگامی که اولین فونت انتخابی در دسترس نبود، کنترل بیشتری روی اندازه فونت ها داشته باشیم. | 3 |
| font-stretch | با استفاده از خاصیت Font-strech می توان یک متن را کشیده تر یا باریک تر (فشرده تر) کرد. | 3 |
خصوصیت های ایجاد محتوی
| خصوصیت | توضیحات | CSS |
|---|---|---|
| content | خاصیت content با ترکیب شبه عنصرهای after: و after: برای درج محتوا به کار می رود. | 2 |
| counter-increment | با استفاده از خاصیت counter-increment می توان مقادیر یک یا چند شمارنده را افزایش داد. | 2 |
| counter-reset | با استفاده از خاصیت counter-reset می توان یک یا چند شمارنده ایجاد نمود یا آنها را بازنشانی (reset) کرد. | 2 |
| quotes | با استفاده از خصوصیت quotes می توان علامت کوتیشنی که داخل عنصر کوتیشن دیگر قرار دارد را مشخص کرد | 2 |
خصوصیت های Grid
| خصوصیت | توضیحات | CSS |
|---|---|---|
| grid-columns | عرض هر ستون را در یک Gird مشخص می کند. | 3 |
| grid-rows | ارتفاع هر ستون را در یک Grid مشخص می کند. | 3 |
خصوصیت های Hyperlink
| خصوصیت | توضیحات | CSS |
|---|---|---|
| target | با استفاده از خصوصیت مختصر شده target می توان تنظیمات مربوط به خصوصیت های target-name ،target-new و target-position را در یک تخصیص تعیین کرد. | 3 |
| target-name | مشخص می کند که لینک در کجا باز شود. (مقصد لینک کجاست) | 3 |
| target-new | با استفاده از خصوصیت target-new می توان مشخص کرد که لینک های جدید در پنجره جدید باز شوند و یا در سربرگ جدیدی در پنچره جاری باز شوند. | 3 |
| target-position | با استفاده از خصوصیت target-position می توان مشخص کرد که مقصد جدید لینک باید کجا باشد. | 3 |
خصوصیت های List
| خصوصیت | توضیحات | CSS |
|---|---|---|
| list-style | با استفاده از فرم مختصر شده list-style می توان تمام خصوصیات مربوط به لیست را در یک خط تخصیص داد. | 1 |
| list-style-image | با استفاده از خصوصیت list-style-image می توان تصویری را جایگزین علامت لیست کرد. | 1 |
| list-style-position | با استفاده از خصوصیت list-style-position می توان مشخص کرد که آیا علامت داخل فضای محتوا قرار گیرد یا خارج از فضای محتوا. | 1 |
| list-style-type | با استفاده از خصوصیت list-style-type می توان نوع علامت عناصر یک لیست را مشخص کرد. | 1 |
خصوصیت های Margin
| خصوصیت | توضیحات | CSS |
|---|---|---|
| margin | فرم مختصر شده margin برای تنظیم تمام خصوصیت های margin در یک اعلان می باشد. این خصوصیت می تواند از یک تا چهار مقدار داشته باشد. | 1 |
| margin-bottom | با استفاده از خصوصیت margin می توان میزان margin از لبه پایین را مشخص کرد. | 1 |
| margin-left | با استفاده از خصوصیت margin-left می توان میزان margin از لبه سمت چپ را مشخص کرد. | 1 |
| margin-right | با استفاده از خصوصیت margin-left می توان میزان margin از لبه سمت چپ را مشخص کرد. | 1 |
| margin-top | با استفاده از خصوصیت margin-top می توان میزان margin از لبه پایین را مشخص کرد. | 1 |
خصوصیت های Multi-column
| خصوصیت | توضیحات | CSS |
|---|---|---|
| column-count | با استفاده از خاصیت column-count تعداد ستون هایی که یک عنصر باید به آن تعداد تقسیم شود را مشخص می کنیم. | 3 |
| column-fill | با استفاده از خصوصیت column-fill مشخص می کنیم که نحوه پر شدن ستون ها به صورت متوازن (balanced) باشد یا خیر. | 3 |
| column-gap | با استفاده از خاصیت column-gap می توانیم میزان فاصله (شکاف) بین هر دوستون را مشخص کنیم. | 3 |
| column-rule | خصوصیت column-rule در واقع فرم مختصر شده ای برای تنظیم تمام خاصیت های *-column-rule می باشد | 3 |
| column-rule-color | رنگ خط بین ستون ها را مشخص می کند. | 3 |
| column-rule-style | استایل خط بین ستون ها را مشخص می کند. | 3 |
| column-rule-width | ضخامت (عرض) خط بین ستون ها را مشخص می کند. | 3 |
| column-span | با استفاده از خاصیت column-span می توانیم مشخص کنیم که یک عنصر باید در چند ستون محصور و محدود شود. | 3 |
| column-width | ضخامت ستون ها را مشخص می کند | 3 |
| columns | خاصیت columns فرم مختصر شده ای برای تنظیم خاصیت های column-width و column-count می باشد. | 3 |
خصوصیت های Padding
| خصوصیت | توضیحات | CSS |
|---|---|---|
| padding | با استفاده از خصوصیت مختصر شده padding می توانیم تمام خصوصیت های padding را در یک تخصیص مقدار دهی کنیم. (فاصله بین border تا شروع محتوا، padding تلقی می شود) این خصوصیت می تواند از یک تا چهار مقدار داشته باشد. | 1 |
| padding-bottom | با استفاده از خصوصیت padding-bottom می توانیم padding پایین یک عنصر را مقدار دهی کنیم. | 1 |
| padding-left | با استفاده از خصوصیت padding-left می توانیم padding پایین یک عنصر را مقدار دهی کنیم | 1 |
| padding-right | با استفاده از خصوصیت padding-right می توانیم padding سمت راست یک عنصر را مقدار دهی کنیم. | 1 |
| padding-top | با استفاده از خصوصیت padding-top می توانیم padding بالای یک عنصر را مقدار دهی کنیم. | 1 |
خصویت های Paged Media
| خصوصیت | توضیحات | CSS |
|---|---|---|
| fit | 3 | |
| fit-position | 3 | |
| image-orientation | 3 | |
| page | 3 | |
| size | 3 |
خصوصیت های Positioning
| خصوصیت | توضیحات | CSS |
|---|---|---|
| bottom | برای عناصری که مکان آن ها absolute است، ویژگی bottom لبه پایینی عنصر را نسبت به عنصر والدش، بالا یا پایین می برد. برای عناصری که مکان آن ها relative است، ویژگی bottom لبه پایینی عنصر را نسبت به مکان خودش، بالا یا پایین می برد. |
2 |
| clear | با استفاده از خاصیت clear مشخص می کنیم که در کدام سمت از یک عنصر، عناصر شناور دیگر اجازه قرار گیری ندارند. | 1 |
| clip | با استفاده از خاصیت clip می توانید یک مستطیل برای بریدن عنصری که به صورت absoulote موقعیت دهی شده است، مشخص کنید. | 2 |
| cursor | 2 | |
| display | با استفاده از خاصیت display می توانیم نوع boxی که برای عنصر به کار رفته است را مشخص کنیم. | 1 |
| float | با استفاده از خصوصیت float مشخص می کنیم که آیا یک box (یا عنصر) باید شناور شود یا خیر. | 1 |
| left | با استفاده از خصوصیت left، هنگامی که عنصر به صورت absolute مکان دهی شده است، می توان لبه سمت چپ عنصر را نسبت به والدش به چپ یا راست جا به جا کرد. | 2 |
| overflow | با استفاده از خصوصیت overflow می توان مشخص کرد هنگامی که محتوا سرریز می شود، چه اتفاقی رخ دهد. | 2 |
| position | با استفاده از خصوصیت position، می توان روش مکان دهی به یک عنصر را مشخص کرد (static, relative, absolute or fixed). | 2 |
| right | با استفاده از خصوصیت right، هنگامی که عنصر به صورت absolute مکان دهی شده است، می توان لبه سمت راست عنصر را نسبت به والدش به چپ یا راست جا به جا کرد. | 2 |
| top | برای عناصری که مکان آن ها absolute است، ویژگی top لبه بالایی عنصر را نسبت به عنصر والدش، بالا یا پایین می برد. برای عناصری که مکان آن ها relative است، ویژگی top لبه بالایی عنصر را نسبت به مکان خودش، بالا یا پایین می برد. |
2 |
| visibility | با استفاده از خصوصیت visibility می توانید،یک عنصر را نمایش بدهید یا آن را مخفی کنید. | 2 |
| z-index | خصوصیت z-index ترتیب عناصر را مشخص می کند (کدام عنصر باید جلو یا پشت دیگر عناصر باشد) | 2 |
خصوصیت های Print
| خصوصیت | توضیحات | CSS |
|---|---|---|
| orphans | 2 | |
| page-break-after | با استفاده از خصوصیت page-break-after می توان رفتار مربوط به شکستن صفحه (رفتن به صفحه بعد) را بعد از یک عنصر تنظیم کرد. | 2 |
| page-break-before | با استفاده از خصوصیت page-break-before می توان رفتار مربوط به شکستن صفحه (رفتن به صفحه بعد) را قبل از یک عنصر تنظیم کرد. | 2 |
| page-break-inside | با استفاده از خصوصیت page-break-before می توان رفتار مربوط به شکستن صفحه (رفتن به صفحه بعد) داخل یک عنصر را تنظیم کرد. | 2 |
| widows | 2 |
خصوصیت های Ruby
| خصوصیت | توضیحات | CSS |
|---|---|---|
| ruby-align | 3 | |
| ruby-overhang | 3 | |
| ruby-position | 3 | |
| ruby-span | 3 |
خصوصیت های Speech
| خصوصیت | توضیحات | CSS |
|---|---|---|
| mark | 3 | |
| mark-after | 3 | |
| mark-before | 3 | |
| phonemes | 3 | |
| rest | 3 | |
| rest-after | 3 | |
| rest-before | 3 | |
| voice-balance | 3 | |
| voice-duration | 3 | |
| voice-pitch | 3 | |
| voice-pitch-range | 3 | |
| voice-rate | 3 | |
| voice-stress | 3 | |
| voice-volume | 3 |
خصوصیت های Table
| خصوصیت | توضیحات | CSS |
|---|---|---|
| border-collapse | با استفاده از خاصیت border-collapse، می توانید لبه های دوخطی یک جدول را به لبه های یک خطی و مجزا تبدیل نمایید. | 2 |
| border-spacing | با استفاده از خصوصیت border-spacing، می توانید فاصله بین لبه ها در سلول های مجاور یک جدول را مشخص نمایید. | 2 |
| caption-side | با استفاده از خاصیت caption-side می توانیم مکان قرار گیری عنوان جدول را مشخص کنیم. | 2 |
| empty-cells | Specifies whether or not to display borders and background on empty cells in a table | 2 |
| table-layout | با استفاده از خصوصیت table-layout می توان الگوریتم چیدمان ظاهری جدول را تنظیم کرد. | 2 |
خصوصیت های Text
| خصوصیت | توضیحات | CSS |
|---|---|---|
| color | با استفاده از خاصیت color می توانیم رنگ متن را مشخص کنیم. | 1 |
| direction | با استفاده از خاصیت direction می توانیم جهت نوشتن متن را مشخص کنیم. | 2 |
| letter-spacing | با استفاده از خصوصیت letter-spacing می توان فاصله حروف یک متن را افزایش یا کاهش داد. | 1 |
| line-height | با استفاده از خصوصیت line-height می توان ارتفاع خطوط را مشخص کرد. | 1 |
| text-align | با استفاده از خصوصیت text-align می توان ترازبندی افقی نوشته ها در یک عنصر را مشخص کرد. | 1 |
| text-decoration | خصوصیت text-decoration نحوه آذین بندی نوشته ها را مشخص می کند. | 1 |
| text-indent | با استفاده از خصوصیت text-indent می توان میزان تورفتگی اولین خط یک متن را مشخص کرد. | 1 |
| text-transform | با استفاده از خصوصیت text-transform می توان حروف یک متن را به حروف بزرگ یا کوچک تبدیل کرد. | 1 |
| unicode-bidi | با استفاده از ترکیب خصوصیت unicode-bidi با خصوصیت direction می توان مشخص کرد که آیا متن باید بازنویسی شود تا چند زبانی را در یک سند پشتیبانی کند یا خیر. | 2 |
| vertical-align | با استفاده از خصوصیت vertical-align می توان تراز بندی عمودی یک عنصر را تنظیم کرد. | 1 |
| white-space | با استفاده از خصوصیت white-space می توان مشخص کرد که خطوط فاصله داخل یک عنصر چگونه مدیریت شوند. | 1 |
| word-spacing | : با استفاده از خصوصیت word-spacing می توان فاصله بین کلمات را کاهش یا افزایش داد. | 1 |
| hanging-punctuation | Specifies whether a punctuation character may be placed outside the line box | 3 |
| punctuation-trim | Specifies whether a punctuation character should be trimmed | 3 |
| text-align-last | Describes how the last line of a block or a line right before a forced line break is aligned when text-align is "justify" | 3 |
| text-justify | با استفاده از خصوصیت text-justify می توان مشخص کرد، هنگامی متن justify می شود، روش justify شدن چگونه باشد. | 3 |
| text-outline | با استفاده از خصوصیت text-outline می توان برای یک متن خط خارجی (outline) مشخص کرد. | 3 |
| text-overflow | با استفاده از خصوصیت text-overflow می توان مشخص کرد هنگامی متن از عنصر والدش سرریز می کند، چه اتفاقی رخ دهد. | 3 |
| text-shadow | با استفاده از خصوصیت text-shadow می توان به متن سایه اضافه کرد. | 3 |
| text-wrap | با استفاده از خصوصیت text-wrap می توان قوانین مربوط به شکستن خط را در یک متن مشخص کرد. | 3 |
| word-break | با استفاده از خصوصیت word-break می توان قانون شکستن خط را برای رسم الخط non-CJK تعیین کرد. | 3 |
| word-wrap | با استفاده از خصوصیت word-wrap کلماتی با طول بلند که در خط جا نمی شوند، شکسته می شوند و در خط بعدی نمایش داده می شوند. | 3 |
خصوصیت های 2D/3D Transform
| خصوصیت | توضیحات | CSS |
|---|---|---|
| transform | با استفاده از خصوصیت transform می توان تبدیل دوبعدی و سه بعدی را به یک عنصر اعمال کرد. این خصوصیت اجازه می دهد تا عناصر را بچرخایند، عناصر را کج کنید، مقیاس عناصر را افزایش و یا کاهش دهید، عناصر را حرکت دهید. | 3 |
| transform-origin | با استفاده از خصوصیت transform-origin می توان مکان عنصر تبدیل شده را تغییر داد. | 3 |
| transform-style | با استفاده از خصوصیت transform-style می توان نحوه چرخیدن عناصر تو در تو را در فضای سه بعدی مشخص کرد. | 3 |
| perspective | با استفاده از خصوصیت perspective می توان مشخص کرد که یک عنصر سه بعدی در چند پیکسلی دید کاربر قرار گیرد. این خصوصیت به شما اجازه می دهد تا دور نمای عناصر سه بعدی را تغییر دهید تا نمای آنها تغییر یابند. | 3 |
| perspective-origin | با استفاده از خصوصیت perspective-origin می توان مشخص کرد که یک عنصر سه بعدی روی محور X و محور y از کجا شروع شود. این خصوصیت به شما اجازه می دهد، محل قرارگیری عنصر سه بعدی از پایین را مشخص کنید. | 3 |
| backface-visibility | با استفاده از خصوصیت backface-visibility، می توان مشخص نمود، زمانی که پشت عنصر به سمت صفحه نمایش است، آیا دیده شود یا خیر. | 3 |
خصوصیت های Transition
| خصوصیت | توضیحات | CSS |
|---|---|---|
| transition | با استفاده از فرم مختصر شده خصوصیت transition می توان چهار خصوصیت transition را یکجا تعریف کرد. | 3 |
| transition-property | با استفاده از خصوصیت transition-property می توان نام خصوصیت CSSی که انتقال روی آن خصوصیت صورت می گیرد را مشخص کرد. به عبارتی transition-property نام خصوصیت CSSی است که اگر بنحوی تغییر کند، انتقال یا transition صورت می گیرد. | 3 |
| transition-duration | با استفاده از خصوصیت transiiion-duration می توان مشخص کرد عمل انتقال در چند ثانیه یا در چند میلی ثانیه تکمیل شود. | 3 |
| transition-timing-function | با استفاده از خصوصیت transition-timing-function می توان سرعت منحنی انتقال را مشخص کرد. | 3 |
| transition-delay | با استفاده از خصوصیت transition-delay می توان مشخص کرد که پس از چه مدت زمانی انتقال انجام شود. | 3 |
خصوصیت های User-interface
| خصوصیت | توضیحات | CSS |
|---|---|---|
| appearance | با استفاده از خصوصیت appearance، می توانید نحوه نمایش عنصر را شبیه دیگر عناصر قرار دهید. | 3 |
| box-sizing | با استفاده از خصوصیت box-sizing می توانید عناصر را در یک ناحیه fit کنید. | 3 |
| icon | 3 | |
| nav-down | با استفاده از خصوصیت nav-down می توان مشخص کرد که هنگام فشردن کلید مکان نمای پایین، کدام عنصر انتخاب شود. | 3 |
| nav-index | Specifies the tabbing order for an element | 3 |
| nav-left | با استفاده از خصوصیت nav-left می توان مشخص کرد که هنگام فشردن کلید مکان نمای پایین، کدام عنصر انتخاب شود. | 3 |
| nav-right | با استفاده از خصوصیت nav-right می توان مشخص کرد که هنگام فشردن کلید مکان نمای راست، کدام عنصر انتخاب شود. | 3 |
| nav-up | با استفاده از خصوصیت nav-up می توان مشخص کرد که هنگام فشردن کلید مکان نمای بالا، کدام عنصر انتخاب شود. | 3 |
| outline-offset | با استفاده از خصوصیت outline-offset، می توان افستی را در اطراف border عنصر ایجاد کرد. | 3 |
| resize | با استفاده از خصوصیت resize می توان مشخص کرد که یک کاربر می تواند عنصری را تغییر سایز دهد یا خیر. | 3 |
- نوشته شده توسط امیر پهلوان صادق
- بازدید: 84383