Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
Any | ۳٫۰+ | Any | None | None | Any | Any |
خصوصیت appearance برای نمایش یک المان با base سیستم عامل و مرورگر پیشفرض استفاده می شود .
به بیان ساده تر ، این خصوصیت به دو دلیل استفاده می شود .
۱- تاثیر استایل پیشفرض پلتفرم بر روی المان هایی که استایل پیشفرض ندارند
۲- تاثیر استایل دلخواه بر روی المان هایی که استایل پیشفرض پلتفرم دارند
input[type=search] { -webkit-appearance: none; }
input[type=text] { -webkit-appearance: searchfield; }
به مثال زیر توجه داشته باشید ( با دقت به لبه ها و گوشه های text box نگاه کنید )
(جهت مشاهده بزرگتر بر روی ویرایش کلیک کنید )
در انتهای این آموزش مقادیر قابل قبول برای موتور های webkit و mozilla نوشته شده است .
Chrome | Safari | Firefox | Opera | IE | Android | iOS |
---|---|---|---|---|---|---|
Any | ۳٫۰+ | Any | None | None | Any | Any |
WebKit values checkbox radio push-button square-button button button-bevel listbox listitem menulist menulist-button menulist-text menulist-textfield scrollbarbutton-up scrollbarbutton-down scrollbarbutton-left scrollbarbutton-right scrollbartrack-horizontal scrollbartrack-vertical scrollbarthumb-horizontal scrollbarthumb-vertical scrollbargripper-horizontal scrollbargripper-vertical slider-horizontal slider-vertical sliderthumb-horizontal sliderthumb-vertical caret searchfield searchfield-decoration searchfield-results-decoration searchfield-results-button searchfield-cancel-button textfield textarea Mozilla values none button checkbox checkbox-container checkbox-small dialog listbox menuitem menulist menulist-button menulist-textfield menupopup progressbar radio radio-container radio-small resizer scrollbar scrollbarbutton-down scrollbarbutton-left scrollbarbutton-right scrollbarbutton-up scrollbartrack-horizontal scrollbartrack-vertical separator statusbar tab tab-left-edge Obsolete tabpanels textfield textfield-multiline toolbar toolbarbutton toolbox -moz-mac-unified-toolbar -moz-win-borderless-glass -moz-win-browsertabbar-toolbox -moz-win-communications-toolbox -moz-win-glass -moz-win-media-toolbox tooltip treeheadercell treeheadersortarrow treeitem treetwisty treetwistyopen treeview window
دیدگاه بگذارید
Be the First to Comment!