Aspect - CSS-Tricks | Almanah CSS 2025

appearanceProprietatea este folosit pentru a afișa un element folosind un stil platforma nativ bazat pe tema sistemului de operare utilizatorilor.

.thing ( -webkit-appearance: value; -moz-appearance: value; appearance: value; )

Acest lucru începe să fie neprefixat, ceea ce este minunat, deoarece povestea cross-browser aici este foarte complicată.

appearanceProprietatea este utilizat pentru unul din două motive:

Pentru a aplica un stil specific platformei unui element care nu îl are în mod implicit
Pentru a elimina stilul specific platformei unui element care îl are în mod implicit

De exemplu, intrările cu un type=searchbrowser WebKit în mod implicit au colțuri rotunjite și sunt foarte stricte în ceea ce puteți modifica prin CSS. Dacă nu doriți acest stil, îl puteți elimina dintr-o singură lovitură cu aspect.

input(type=search) ( -webkit-appearance: none; )

Sau ați putea lua o intrare cu tipul = text și să o faceți să arate ca o intrare de căutare:

input(type=text) ( -webkit-appearance: searchfield; )

Valorile WebKit

Caseta de bifat
radio
apasa butonul
buton pătrat
buton
buton-teșit
casetă listă
listitem
menulist
buton menulist
menulist-text
menulist-textfield
butonul scrollbar-up
butonul scrollbar-down
butonul scrollbar-stânga
scrollbarbutton-right
scrollbartrack-horizontal
scrollbartrack-vertical
scrollbarthumb-horizontal
scrollbarthumb-vertical
scrollbargripper-horizontal
scrollbargripper-vertical
glisor-orizontal
glisor-vertical
sliderthumb-orizontal
sliderthumb-vertical
semn de omisiune
searchfield
decor-câmp de căutare
Căutare-rezultate-decorare
butonul searchfield-results
butonul searchfield-cancel
textfield
textarea

Valorile Mozilla

nici unul
buton
Caseta de bifat
caseta de selectare-container
casetă de selectare-mică
dialog
casetă listă
articol din meniu
menulist
buton menulist
menulist-textfield
menupopup
bara de progres
radio
radio-container
radio-mic
redimensionare
bara de derulare
butonul scrollbar-down
butonul scrollbar-stânga
scrollbarbutton-right
butonul scrollbar-up
scrollbartrack-horizontal
scrollbartrack-vertical
separator
bara de stare
filă
tab-edge-left-obsolete
tabeluri
textfield
textfield-multilinie
bara de instrumente
butonul barei de instrumente
trusa de scule
-moz-mac-unified-toolbar
-moz-win-borderless-glass
-moz-win-browsertabbar-toolbox
-moz-win-communications-toolbox
-moz-win-glass
-moz-win-media-toolbox
sfat de instrumente
treeheadercell
treeheadersortarrow
treeitem
treetwisty
treetwistyopen
vedere de copac
fereastră

Resurse

Documente Mozilla pentru -moz-aspect
Trent Walton pe aspectul Webkit
Shaun Inman despre dezactivarea textului interior al umbrelor de intrări de text pe iPad
CSS3 Spec

Suport pentru browser

Aceste date de asistență pentru browser provin de la Caniuse, care are mai multe detalii. Un număr indică faptul că browserul acceptă funcția în versiunea respectivă și în sus.