near_me
Inizia
keyboard_arrow_downlayers
Stile
keyboard_arrow_downwidgets
Componenti
keyboard_arrow_downlocal_mall
Risorse
keyboard_arrow_downÈ disponibile il nuovo mdui 2 basato su Material Design 3 e Web Components, vai alla documentazione di mdui 2.
Ombre
mdui offre 24 diverse profondità di ombra per soddisfare le esigenze di qualsiasi scenario in Material Design.
Letture correlate
Aggiungere un'ombra
Basta aggiungere la classe .mdui-shadow-[1-24] all'elemento e l'elemento avrà l'ombra della profondità corrispondente. Aggiungendo la classe .mdui-shadow-0 è possibile rimuovere l'ombra.
Trascina il cursore sottostante per osservare i cambiamenti dell'ombra a diverse profondità.
Approfondire l'ombra al passaggio del mouse
Aggiungi la classe .mdui-hoverable a qualsiasi elemento per approfondire l'ombra quando il mouse passa sopra di esso.
Esempio
<div class="mdui-card mdui-hoverable">
<div class="mdui-card-media">
<img src="card.jpg"/>
</div>
<div class="mdui-card-actions">
<button class="mdui-btn mdui-ripple">action 1</button>
<button class="mdui-btn mdui-ripple">action 2</button>
</div>
</div>