2015-10-04 21 views
6

font-size numarasını değiştirmek istediğimde üzerinde çalıştığım ancak metnin genişliğini ve yüksekliğini bağımsız olarak değiştiren iki özelliği üzerinde çalışıyorum. Yani bu kadar font-width: 50% uygularken:Yazı tipi yüksekliğini ve genişliğini değiştir

enter image description here

metin yarım gergin olurdu:

enter image description here

CSS ile yapmak için bu mümkün mü, ayrıca yükseklik özelliğiyle?

p { 
 
    display: inline-block; 
 
    font-size: 32px; 
 
    transform: scale(.5, 1); 
 
}
<p>This is text.</p>

kullanımı, sırasıyla, X ve Y ekseni için işlev iki numaraları:

+1

"eğer Tembelliğin burada bir keman ". Bunun nasıl gideceğinden emin değilim. Bu jquery ile yardımcı olabilir. Bir sayı oluşturduğunuzda ve 2 css özelliğini değiştirdiğinizde. Sadece net olmak için metnin genişliğini ve yüksekliğini bağımsız olarak kontrol etmek istersiniz. Şu anda genişliği nasıl kontrol ediyorsunuz –

+0

http://stackoverflow.com/questions/15649244/responsive-font-sizeBu yardımcı olabilir –

+0

CSS'de font-width-stretch özelliği var ama şu anda tümüyle desteklenmiyor. büyük tarayıcılar –

cevap

19

CSS3 transform için bu scale işlevi vardır.

4

Yazı tipini x yönünde ölçeklendirmeyi deneyebilirsiniz. Ben @Xufox bkz

--EDIT--

p{ 
    -webkit-transform: scaleX(0.5); 
    transform: scaleX(0.5); 
} 

Üyeliğiniz bunu yanıtladı. Bulabileceğim

1

yakın şey Bu sadece cesur, normal değil, aynı zamanda sayısal değerler kabul font-weight

olduğunu. 100 artışlarla 100-900.

. Paragraph {font-weight :700;} 

Bu yardımcı olmalıdır yükseklik özellikleriyle kombine ancak kelimelerin genişliğini azaltabilir olarak aralık özelliklerine bakmak çözümü sizin de

vermeyecektir bu şekilde

letter-spacing: 2px; 
İlgili konular