SORU
3 Temmuz 2009, Cuma


Nasıl CSS çapraz tarayıcı ile dikey metin çizebilir miyim?

90 derece, çapraz tarayıcı (>tarafından tek bir metin kelime döndürmek istiyorum = IE6, >= 2, Krom, Safari, Opera veya herhangi bir sürümü Firefox) desteği. Bu nasıl yapılabilir?

CEVAP
3 Temmuz 2009, Cuma


Yeni bilgiler ile güncellenen bu Cevap (CSS Tricks). Filtre uygulaması işaret için Matt ve Douglas şeref.

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

  /* also accepts left, right, top, bottom coordinates; not required, but a good idea for styling */
  -webkit-transform-origin: 50% 50%;
  -moz-transform-origin: 50% 50%;
  -ms-transform-origin: 50% 50%;
  -o-transform-origin: 50% 50%;
  transform-origin: 50% 50%;

  /* Should be unset in IE9  I think. */
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
}

Eski cevap:

FF 3.5 veya Safari/3.1, Kontrol Y: -moz-transform (- y-dönüşümü). IE Matrix filter(v5.5 ), ama nasıl emin değilim. Opera henüz hiçbir dönüşüm yetenekleri vardır.

.rot-neg-90 {
  /* rotate -90 deg, not sure if a negative number is supported so I used 270 */
  -moz-transform: rotate(270deg);
  -moz-transform-origin: 50% 50%;
  -webkit-transform: rotate(270deg);
  -webkit-transform-origin: 50% 50%;
  /* IE support too convoluted for the time I've got on my hands... */
}

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • 10 Daughters, 2 Sons

    10 Daughters

    10 Mart 2009
  • huyked

    huyked

    28 Mart 2008
  • RiverCityGraphix

    RiverCityGra

    6 Ocak 2012