Costruendo siti con design responsive, sappiamo che una delle cose più difficili da realizzare è legato alla dimensione delle immagini.
Bootstrap ci viene in aiuto utilizzando una classe chiamata img-responsive, che applicherà max-width:100% e height:auto all'immagine, consentendole di adattarsi in caso lo spazio disponibile sullo schermo sia minore di quello dell'immagine, che non uscirà più dai confini dello schermo:
<img src="myimage.png" class="img-responsive" />
L'uso di questa classe è consigliata quando le immagini arrivano da un CMS e non possiamo controllarne direttamente le dimensioni. Un buon design responsive, invece, deve già prevedere che gli elementi che hanno bisogno di scalare ed adattarsi abbiano strategie ben definite e esplicitate all'interno del nostro CSS.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Anonimizzare i dati sensibili nei log di Azure Front Door
Usare i settings di serializzazione/deserializzazione di System.Text.Json di ASP.NET all'interno di un'applicazione non web
Testare l'invio dei messaggi con Event Hubs Data Explorer
Sfruttare gli embedding e la ricerca vettoriale con Azure SQL Database
Gestione dei nomi con le regole @layer in CSS
Rendere i propri workflow e le GitHub Action utilizzate più sicure
Gestire gli accessi con Token su Azure Container Registry
Utilizzare QuickGrid di Blazor con Entity Framework
Utilizzare i variable font nel CSS
Creare una libreria CSS universale - Rotazione degli elementi
La gestione della riconnessione al server di Blazor in .NET 9
Creare agenti facilmente con Azure AI Agent Service
I più letti di oggi
- Recuperare l'ultima versione di una release di GitHub
- Rendere i propri workflow e le GitHub Action utilizzate più sicure
- Disabilitare le run concorrenti di una pipeline di Azure DevOps
- Gestione dei nomi con le regole @layer in CSS
- Introduzione alle Container Queries in CSS
- Fornire parametri ad un Web component HTML
- Visual Studio Live: what's next - Online
- .NET Conference Italia 2021 - Online
- ASP.NET MVC Release Candidate 2