در مطالب قبلی در مورد رابط کاربری در زبان CSS3 مقدمه ای را برای شما ارائه کردیم.در این آموزش قصد داریم تا تا دقیق تر به این موضوع بپردازیم و خواص موجود در این مبحث را برای شما تشریح و بررسی کنیم.خاصیتی که در زیر به بررسی آن می پردازیم خاصیت appearence است.
خاصیت appearence :
خاصیت appearence به شما این امکان را می دهد که عنصر HTML مورد نظرتان را به شکل یک المنت رابط کاربری دیگر ( مثل یک دکمه فرمان ) نمایش دهید .
برای مثال یک پاراگراف را به صورت دکمه فرمان بر روی صفحه نمایش دهید . یا کاری کنید یک عکس همانند یک آیکون نشان داده شود .
شکل کلی استفاده از این خاصیت به صورت زیر است :
;Syntax: appearance : normal | icon | window | button | menu | field
; appearance : button :مثال
توضیح هر یک از موارد syntax :
مقدار این خاصیت تعیین کننده نحوه نمایش عنصر مورد نظر است .
استفاده از این پارامتر اجباری است .
normal :
در این حالت عنصر به حالت عادی نمایش داده می شود .
icon :
باعث می شود تا عنصر به صورت یک عکس کوچک ( آیکون ) نمایش داده شود .
window :
این حالت عنصر را به صورت یک پنجره یا فریم نمایش می دهد .
button :
این حالت عنصر را به صورت یک دکمه فرمان نمایش می دهد .
menu :
این حالت عنصر را به صورت یک منو نمایش می دهد .
field :
این حالت عنصر را به صورت یک فیلد نمایش می دهد .
پشتیانی در مرورگر های مختلف :
متاسفانه این خاصیت به صورت عادی توسط هیچ یک از مرورگر های مطرح پشتیانی نمی شود . برای پشتیبانی در مرورگرهای مختلف باید برای هر کدام ، کد لازم آنها که در جدول زیر آمده را استفاده نمود :
کد لازم برای پشتیانی نوع مرورگر:
مرورگر فایرفاکس با اعمال یک تغییر در کد خاصیت از آن پشتیانی می کند . برای پشتیانی این مرورگر باید خاصیت را به صورت moz-appearance- بنویسید .
مرورگر اپرا باز این خاصیت پشتیانی نمی کند .
مرورگر اکسپلورر از این خاصیت پشتیانی نمی کند .
مرورگر کروم با اعمال یک تغییر در کد خاصیت از آن پشتیانی می کند . برای پشتیانی این مرورگر باید خاصیت را به صورت webkit-appearance- بنویسید .
مثال عملی :
