Come sfogliare orizzontale a verticale in HTML

July 4

Come sfogliare orizzontale a verticale in HTML


La maggior parte delle pagine Web sono, logicamente, formattati per leggere da sinistra a destra e dall'alto in basso. Ma per alcuni disegni, è utile essere in grado di avere un testo esecuzione lateralmente, sia dalla parte inferiore dello schermo in alto o dall'alto verso il basso. E 'semplice da imitare questo effetto utilizzando testo grafico, ma si perde un po' del potenziale dinamico di campi di testo, così come la possibilità di copiare e incollare il testo capovolto nella altri campi di testo. Un modo esiste per capovolgere il testo da orizzontale a verticale utilizzando la codifica HTML.

istruzione

1 Racchiudere il testo che si desidera capovolgere in un tag span.

Esempio: <span> Testo Capovolto </ span>

2 Inserire un Webkit comando di trasformazione per capovolgere il testo per gli utenti di Safari. Utilizzare -90 avere il testo che va dalla parte inferiore dello schermo verso l'alto, e 90 di avere il testo che va dalla parte superiore alla parte inferiore. Utilizzare un punto e virgola per separare questo comando dai seguenti comandi specifici del browser.

esempio:

<Span -webkit-transform: rotate (-90deg);> Testo Capovolto </ span>

3 Inserire una seconda trasformazione codice utilizzando prefisso specifico browser di Mozilla.

esempio:

<Span -webkit-transform: rotate (-90deg); -moz-transform: rotate (-90deg);> Testo Capovolto </ span>

4 Inserire un filtro BasicImage per capovolgere il testo per gli utenti di Internet Explorer. In questo caso, il valore di rotazione 3 verrà eseguito il testo dal basso verso l'alto, e 1 verrà eseguito il testo da cima a fondo.

esempio:

<Span -webkit-transform: rotate (-90deg); -moz-transform: rotate (-90deg); Filtro: progid: DXImageTransform.Microsoft.BasicImage (rotazione = 3);> Testo Capovolto </ span>

Consigli e avvertenze

  • Metti alla prova il tuo codice nel maggior numero possibile di browser per assicurarsi di avere ragione. Anche se ci possono essere alcune piccole modifiche da browser a browser, questa impostazione fa in modo che il maggior numero di browser possibili vedere il testo come si desidera essere visto.
  • Usa capovolto il testo con parsimonia. I browser meno recenti possono non renderlo correttamente, e non attuale metodo esiste per lanciare testo in browser Netscape a tutti.