در  این بخش با صفات dimension ،classification آشنا خواهید شد

با  dimension (ابعاد) شروع می کنیم:

این صفت به شما اجازه می دهد که طول و عرض یک عنصر را کنترل کنید.

height=ارتفاع عنصر را تعیین میکند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

line-height=فاصله بین خطوط را تعیین میکند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

max-height=حد اکثر ارتفاع یک عنصر را تعیین میکند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

min-heigh=حد اقل ارتفاع یک عنصر را تعیین میکند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

width=عرض عنصر را تعیین می کند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

max-width=حد اکثر عرض یک عنصر را تعیین میکند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

min-width=حداقل عرض ع یک عنصر را تعیین میکند و می تواند auto یا یک عدد ثابت یا بر حسب درصد باشد.

صفت classification:

این صفت این امکان را به ما میدهد که چگونه و کجا یک عنصر را نمایش دهیم.

صفت clear

left

right

both

none

cursor=برای تعیین مکان نما در یک عنصر

url

auto

crosshair

default

pointer

move

e-resize

ne-resize

nw-resize

n-resize

se-resize

sw-resize

s-resize

w-resize

text

wait

help

display=چگونگی نمایش یک عنصر

none=عنصر نمایش داده نشود

block=عنصر را به صورت یک بلاک نمایش می دهد و قبل و بعد عنصر خط شکسته می شود

inline=مانند عنصر قبل با این تفاوت که خط شکسته نمی شود

list-item=عنصر به صورت لیست نمایان می شود.

run-in=یا به صورت block یا به صورت inline (به محتوا بستگی دارد).

compact=مانند صفت قبل می باشد.

marker=

table

inline-table

table-row-group

table-header-group

float=برای نمایش یک تصویر یا متن در یک عنصر دیگر به کار می رود

left

right

none

position=مکان یک عنصر را مشخص می کند

static=عنصر در جای عادی خود قرار می گیرد

relatev=

absolute

fixed=موقعیت ثابت خواهد بود

visibiliyتعیین میکند که یک عنصر نمایش داده شود یا نه

visible=ضاهر بودن عنصر

hiden=پنهان بودن عنصر

collapse=اگر در جدول استفاده شود باعث پنهان کردن یک سطر یا ستون می شود و در سایر عناصر کار hiden را انجام میدهد.

مثال شماره یک

h2{cursor:move;}

h2{cursor: url(first.cur),url(second.cur), pointer;}

==================================

مثال شماره دو

p{display:block;}

h2{cursor:move;display:none;}

th,td{display:table-sell;}

==================================

مثال شماره سه

img{float:left;}/*زمانی اتفاق می افتد که این تصویر بر روی تصویری دیگر بیفتد مثلا بر روی لوگوی سایت شما*/

==================================

مثال شماره چهار

h1{

position:absolute;

left:100px;

right:50px;

}

==================================

مثال شماره پنج

p{visibility:visible;}