Warning: Declaration of Bootstrap_Walker::start_lvl(&$output, $depth) should be compatible with Walker_Nav_Menu::start_lvl(&$output, $depth = 0, $args = NULL) in /home/itport/public_html/wp-content/themes/itport-v5.0/functions/bootstrap-walker.php on line 25

Warning: Declaration of Bootstrap_Walker::end_lvl(&$output, $depth) should be compatible with Walker_Nav_Menu::end_lvl(&$output, $depth = 0, $args = NULL) in /home/itport/public_html/wp-content/themes/itport-v5.0/functions/bootstrap-walker.php on line 42

Warning: Declaration of Bootstrap_Walker::start_el(&$output, $item, $depth, $args) should be compatible with Walker_Nav_Menu::start_el(&$output, $data_object, $depth = 0, $args = NULL, $current_object_id = 0) in /home/itport/public_html/wp-content/themes/itport-v5.0/functions/bootstrap-walker.php on line 57

Warning: Declaration of Bootstrap_Walker::end_el(&$output, $item, $depth, $args) should be compatible with Walker_Nav_Menu::end_el(&$output, $data_object, $depth = 0, $args = NULL) in /home/itport/public_html/wp-content/themes/itport-v5.0/functions/bootstrap-walker.php on line 108
آی تی پورت | چرخاندن اشیا در وبسایت با استفاده از CSS 3
Warning: Use of undefined constant url - assumed 'url' (this will throw an Error in a future version of PHP) in /home/itport/public_html/wp-content/themes/itport-v5.0/header.php on line 56

Warning: Use of undefined constant title - assumed 'title' (this will throw an Error in a future version of PHP) in /home/itport/public_html/wp-content/themes/itport-v5.0/header.php on line 57
تجارت الکترونیکطراحی وب

چرخاندن اشیا در وبسایت با استفاده از CSS 3

طراحی وب

در خدمتتون هستیم با آموزشی دیگر اینبار به کمک سی اس اس ۳ که البته باید اشاره کنم که این کد در تمامی مرورگرها پشتیبانی میشه 🙂

به کمک این آموزش میتونید اشیا در وبتون بچرخونید ٫ که زیبایی خاصی به صفحات وب میده.

این کد در مرورگرهای مختلف به صورت های مختلفی نوشته میشه که ما در اینجا تمام کدها رو میزاریم و پیشنهاد میکنیم از تمام کدها همزمان استفاده کنید تا در مرورگرهای مختلف ظاهر یکسانی داشته باشید.

اما کد نویسی:

کد عمومی:

transform:rotate(30deg);

کد مخصوص مرورگر اینترنت اکسپلور۹

-ms-transform:rotate(30deg);

کد مخصوص فایرفاکس

-moz-transform:rotate(30deg);

کد مخصوص سافاری و کروم

-webkit-transform:rotate(30deg);

کد مخصوص اپرا

-o-transform:rotate(30deg);

پیشنهاد ما هم اینه که همیشه به صورت کامل به کار ببرید:

transform:rotate(30deg);

-ms-transform:rotate(30deg);

-moz-transform:rotate(30deg);

-webkit-transform:rotate(30deg);

-o-transform:rotate(30deg);

منتظر نظرات پیشنهادات و سوالاتتون هستیم.

گفتگو ها

    سلام محمد جون. خیلی عالی بود. میشه به منم یه کمک بکنی توی یه سی اس اس مشکل دارم

      محمد

      سلام ، قربانت 🙂
      چشم در خدمتم ، سوالاتت اگر عمومی هست همینجا هم بپرسی پاسخ داده میشود 🙂

    ممنون خیلی دنبال این آموزش بودم 🙂

    محمد

    از این مطلب استفاده کردم و از سایت زیباتون لذت بردم.

    فقط خواستم ازتون تشکر کنم و خداقوت بگم.

      محمد النصار

      ممنونم و خوشحالم که براتون مفید واقع شده

    محمد

    مرسی خیلی به کارم اومد