Rotazione di 90 gradi nei CSS in IE8 e inferiore

Come posso ruotare di 90 gradi in IE 8 e inferiore, utilizzando solo CSS?Rotazione di 90 gradi nei CSS in IE8 e inferiore

.horizontal { 
    display: block; 
    width: 300px; 
    height: 100px;/*height*/ 
    background: #FF0000; 
    margin: auto; 
    margin-top: 110px; 
    text-align: center; 
    border: 5px solid #000000; 

    -webkit-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg); 
    -o-transform: rotate(-90deg); 
    -ms-transform: rotate(-90deg); 
    transform: rotate(-90deg); 
}

fonte

2013-07-29 Ronny Perez

se non puoi utilizzare la sostituzione in più di quanto il tuo sono condannati perché non c'è altro modo per IE8 è meglio messaggio vedi in IE8 che si prega di aggiornare il vostro maledetto browser. – Hushme

amico lo so, ma cosa ne pensi dei filtri statici di ms, ma il fatto è che non so come i filtri? Eventuali suggerimenti? –

@Enigma Tuttavia, le domande dovrebbero mostrare uno sforzo di ricerca. – Doorknob

si desidera utilizzare filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);

CSS

.horizontal { 
    display: block; 
    width: 300px; 
    height: 100px;/*height*/ 
    background: #FF0000; 
    margin: auto; 
    margin-top: 110px; 
    text-align: center; 
    border: 5px solid #000000; 

    -webkit-transform: rotate(-90deg); 
    -moz-transform: rotate(-90deg); 
    -o-transform: rotate(-90deg); 
    -ms-transform: rotate(-90deg); 
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3); 
    transform: rotate(-90deg); 
}

More information on this

fonte

2013-07-29 04:32:29 3dgoo

wait ma non rotazione = 3 essere 270 gradi Ho solo bisogno di 90deg –

'rotation = 3' lo ruoterà di 270 gradi o -90 gradi, come nelle altre dichiarazioni di trasformazione css. Se si desidera ruotarli tutti di 90 gradi, impostare 'rotation = 1'. – 3dgoo

writing-mode che è attualmente in progetto di CSS3 CARATTERISTICHETECNIC on ci consente di eseguire la rotazione del testo senza utilizzare proprietà proprietarie, in modo efficace a prova di futuro il concetto in quanto più browser adottano le specifiche di disegno CSS3.

p { writing-mode: tb-rl; }

Questa è una tecnica CSS incredibilmente semplice che alla fine funzionerà con tutti i browser come il loro supporto CSS3 migliora. Questa è una delle poche proprietà supportate da CSS3 in IE. Il valore tb-rl indica al browser di visualizzare paragrafi con il testo che scorre dall'alto verso il basso, da destra verso sinistra. Rotazione essenzialmente del testo di 90 gradi in senso orario e allineamento a destra.

Questa proprietà vera intenzione è per la visualizzazione di altre lingue nella loro corretta “modalità di scrittura”, come diritto giapponese a sinistra o l'arabo & ebraica che del display da destra a sinistra & cima a fondo (rl-tb).

Supporto

Al momento IE è l'unico browser a sostenerlo a partire dal IE5.5 e fino, IE8 aggiunge ulteriori valori attraverso utilizzando l'estensione -ms. Ci sono 4 valori disponibili da IE5.5 + e altri 4 valori per IE8 + attraverso l'estensione -ms.

lr-tb - Questo è il valore predefinito, da sinistra a destra, dall'alto in basso
rl-tb - Questo scorre il testo da destra verso sinistra e dall'alto in basso
tb-rl - cassa il testo verticalmente dall'alto al basso, da destra a sinistra
bt-rl - dal basso verso l'alto, da destra a sinistra
tb-lr - Questo e il valore seguente sono disponibili solo in IE8 + utilizzando -ms-writing-mode. Il testo scorre dall'alto verso il basso, da sinistra a destra
bt-lr - basso in alto, da sinistra a destra
lr-bt - Da sinistra a destra, basso verso l'alto
rl-bt - da destra a sinistra, in basso a top

Ruota il testo negli altri browser?

-webkit-transform: rotate(90deg); 
-moz-transform: rotate(90deg); 
-ms-transform: rotate(90deg); 
-o-transform: rotate(90deg); 
transform: rotate(90deg);

Online Demo

-ms-writing-mode property

fonte

2014-06-24 07:35:12 Jeba

Rotazione di 90 gradi nei CSS in IE8 e inferiore

risposta

Problemi correlati