Visualizzazione dei risultati da 1 a 3 su 3
  1. #1
    Utente di HTML.it L'avatar di Bellatrix
    Registrato dal
    Jul 2004
    residenza
    Novi Ligure
    Messaggi
    130

    Classe per fare apparire sotto una dimensione del monitor

    Ciao a tutti gli esperti.
    Ho un sito sul quale vorrei fare apparire una stringa SOTTO una certa dimensione del monitor, tipicamente, cellulari e tablet e, ad esempio, sopra i 066px di larghezza, farla sparire.

    Vorrei lavorare sui CSS; cortesemente, mi date una mano?

    Non saprei proprio come cercare.

  2. #2
    Moderatore di CSS L'avatar di KillerWorm
    Registrato dal
    Apr 2004
    Messaggi
    5,675
    Ciao, dal titolo che hai scritto non capisco se con "classe" ti riferisci al fatto che tu stia utilizzando un qualche framework (tipo bootstrap) o se parli in modo generico. In generale, infatti, indipendente dall'uso di una classe o di un id o di un qualsiasi altro tipo di selettore CSS, si utilizzano le media queries per definire dei breakpoints con cui poter applicare del CSS in modo specifico a seconda della dimensione del viewport. Qui una guida tra le tante che puoi trovare sul web. L'argomento è in genere legato al "Responsive Web Design"; a riguardo puoi trovare varie altre informazioni al capitolo 2 dei link utili CSS sotto la voce "RWD vs. AWD".



    Qui un banale esempio, chiaramente puoi risolvere in vari altri modi:
    codice:
    <!DOCTYPE HTML>
    <html>
       <head>
          <title>Esempio</title>
          <meta charset="utf-8">
          <style type="text/css">
             /* Nascondo l'elemento quando la larghezza del viewport è uguale o supera i 660px */
             @media screen and (min-width: 660px) {
                .elementoDaMostrareSuMobile{
                   display: none;
                }
             }
          </style>
       </head>
       <body>
          <p class="elementoDaMostrareSuMobile">
             <b>Questo testo è visibile solo sotto i 660px di larghezza del viewport.</b>
          </p>
          <p>
             Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi venenatis nibh sit amet mi elementum semper.
          </p>
       </body>
    </html>
    Installa Forum HTML.it Toolset per una fruizione ottimale del Forum

  3. #3
    Utente di HTML.it L'avatar di Bellatrix
    Registrato dal
    Jul 2004
    residenza
    Novi Ligure
    Messaggi
    130
    Ciao KillerWorm.
    Direi... PERFETTO!

    GRAZIE!!

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2024 vBulletin Solutions, Inc. All rights reserved.