Pytania otagowane jako css-transforms

Używając CSS, jak mogę zastosować więcej niż jeden transform? Przykład: poniżej zastosowano tylko tłumaczenie, a nie rotację. li:nth-child(2) { transform: rotate(15deg); transform: translate(-20px,0px); }

602 css  css-transforms 

Mam sytuację, w której w normalnych warunkach CSS ustalony element div zostałby umieszczony dokładnie tam, gdzie jest określony ( top:0px, left:0px). Wydaje się, że nie jest to respektowane, jeśli mam rodzica, który ma transformate3d. Czy ja czegoś nie widzę? Wypróbowałem inne opcje transformacji webkit, takie jak style i transform origin …

140 html  css  css-position  css-transforms 

Powiedzmy, że mam kilka kolumn, z których niektóre chciałbym obracać wartościami: 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> Z tym CSS: .statusColumn b { writing-mode: tb-rl; white-space: nowrap; display: inline-block; overflow: visible; transform: rotate(-90deg); transform-origin: 50% 50%; } Kończy się tak: Czy można napisać dowolny …

119 css  css-transforms 

Mam problemy z obracaniem i pozycjonowaniem wiersza tekstu. Teraz działa tylko pozycja. Obrót również działa, ale tylko wtedy, gdy wyłączę pozycjonowanie. CSS: #rotatedtext { transform-origin: left; transform: rotate(90deg); transform: translate(50%, 50%); } HTML to zwykły tekst.

86 css  webkit  transform  css-transforms 

Używam przejść CSS do przejścia między stanami przekształconymi CSS (w zasadzie przejście skali elementu). Zauważyłem, że gdy element przechodzi, pozostała część tekstu na stronie (w Webkit) ma tendencję do nieznacznej zmiany renderowania, dopóki przejście nie zostanie zakończone. Skrzypce: http://jsfiddle.net/russelluresti/UeNFK/ Zauważyłem również, że nie występuje to w moich nagłówkach, które mają …

81 css  webkit  css-transitions  css-transforms 

Jak łączyć rotateX(50deg) rotateY(20deg) rotateZ(15deg)w skrócie rotate3d()?

79 css  css-transforms 

Próbuję utworzyć animację w stylu roller coaster z CSS. Chcę wiedzieć, jak zakrzywiać „kolejkę”, gdy jest ona w fazie pętli. Poszukuję całego rozwiązania CSS, ale jeśli potrzebuję trochę kodu JavaScript, nie mam nic przeciwko. mój kod do tej pory: #container { width: 200px; height: 300px; margin-top: 50px; position: relative; animation: …

15 html  css  css-animations  css-transforms