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

  • Moodle

    Moodle

    11 Mayıs 2010
  • SelmerSaxMan

    SelmerSaxMan

    24 HAZİRAN 2006
  • The Scary Snowman

    The Scary Sn

    1 ŞUBAT 2011