«css-transforms» etiketlenmiş sorular

CSS kullanarak, birden fazla uygulamayı nasıl uygulayabilirim transform? Örnek: Aşağıda, döndürme değil yalnızca çeviri uygulanır. li:nth-child(2) { transform: rotate(15deg); transform: translate(-20px,0px); }

603 css  css-transforms 

Normal CSS koşullarında, sabit bir div'in tam olarak belirtildiği yere yerleştirileceği bir durumum var ( top:0px, left:0px). Bir translate3d dönüşümü olan bir ebeveyni varsa, bu saygı duyulmuyor gibi görünüyor. Bir şey görmüyor muyum? Stil ve dönüşüm kökeni seçenekleri gibi diğer webkit-dönüşüm denedim ama şansım yoktu. Sarı kutunun kap öğesinin içinde …

140 html  css  css-position  css-transforms 

Diyelim ki, bazılarının değerlerini döndürmek istediğim birkaç sütunum var: http://jsfiddle.net/MTyFP/1/ <div class="container"> <div class="statusColumn"><span>Normal</span></div> <div class="statusColumn"><a>Normal</a></div> <div class="statusColumn"><b>Rotated</b></div> <div class="statusColumn"><abbr>Normal</abbr></div> </div> Bu CSS ile: .statusColumn b { writing-mode: tb-rl; white-space: nowrap; display: inline-block; overflow: visible; transform: rotate(-90deg); transform-origin: 50% 50%; } Şöyle görünüyor: Metnin diğer öğelerle çakışmaması için döndürülen öğenin …

119 css  css-transforms 

Bir metin satırını döndürmede ve konumlandırmada bazı sorunlar yaşıyorum. Şimdi sadece işe yarayan konum. Döndürme de çalışır, ancak yalnızca konumlandırmayı devre dışı bırakırsam. CSS: #rotatedtext { transform-origin: left; transform: rotate(90deg); transform: translate(50%, 50%); } Html sadece düz metindir.

90 css  webkit  transform  css-transforms 

CSS dönüştürülmüş durumlar arasında geçiş yapmak için CSS geçişlerini kullanıyorum (temelde bir öğenin ölçeğini değiştiriyorum). Öğe geçiş yaparken, sayfadaki metnin geri kalanının (Webkit'te) geçiş tamamlanana kadar işlenmesini biraz değiştirmeye eğilimli olduğunu fark ettim. Fiddle: http://jsfiddle.net/russelluresti/UeNFK/ Bunun, başlıklarımda olmadığını da fark ettim. -webkit-font-smoothing: antialiased özellik / değer çifti bulunan . Merak …

81 css  webkit  css-transitions  css-transforms 

CSS ile bir roller coaster tarzı animasyon oluşturmaya çalışıyorum. Döngü aşamasında "bardak altlığı" nasıl eğri bilmek istiyorum. Tamamen bir CSS çözümü arıyorum, ancak biraz JavaScript'e ihtiyaç duyuyorsanız, bununla sorunum yok. şimdiye kadar benim kod: #container { width: 200px; height: 300px; margin-top: 50px; position: relative; animation: 10s infinite loop; animation-timing-function: linear; …

15 html  css  css-animations  css-transforms