AAA Главная
Примеры PHP Примеры JavaScript Примеры Ajax Примеры CSS,HTML

transform: rotate(угол)

transform: rotate(45deg)
transform: rotate(-45deg)
transform: rotate(270deg)



Исходный код этого примера:

<style>
    .trans-box {
        margin: 50px 0 10px 0;
    }
    .trans-item {
        background-color: #deebec;
        font: 14px/24px Arial,sans-serif;
        height: 34px;
        width: auto;
        margin: 10px 0;
        padding: 5px 10px;
        box-sizing: border-box;
        float: left;
    }
    .trans-item.item1 {
        -webkit-transform: rotate(45deg);
        -moz-transform: rotate(45deg);
        -ms-transform: rotate(45deg);
        -o-transform: rotate(45deg);
        transform: rotate(45deg);
    }
    .trans-item.item2 {
        -webkit-transform: rotate(-45deg);
        -moz-transform: rotate(-45deg);
        -ms-transform: rotate(-45deg);
        -o-transform: rotate(-45deg);
        transform: rotate(-45deg);
    }
    .trans-item.item3 {
        -webkit-transform: rotate(270deg);
        -moz-transform: rotate(270deg);
        -ms-transform: rotate(270deg);
        -o-transform: rotate(270deg);
        transform: rotate(270deg);
    }
</style>
<div class="trans-box">
    <div class="trans-item item1" style="transition-timing-function: ease">transform: rotate(45deg)</div>
    <div class="trans-item item2" style="transition-timing-function: ease">transform: rotate(-45deg)</div>
    <div class="trans-item item3" style="transition-timing-function: ease">transform: rotate(270deg)</div>
    <br style="clear: both;">
</div>


.

© Copyright 2008- by KDG



Rambler's Top100