سیداحمد
سیداحمد
خواندن ۱ دقیقه·۴ ماه پیش

منظومه خورشیدی در CSS

https://codepen.io/seyedahmaddv/pen/bGPKarJ

با استفاده از سی اس اس به سادگی میتوان سیارات منظومه شمسی را انیمیت یا متحرک کرد.

بیایید با چند نشانه گذاری بسیار اساسی شروع کنیم:

<ol> <li class=&quotsun&quot></li> <li class=&quotmercury&quot></li> <li class=&quotvenus&quot></li> <li class=&quotearth&quot></li> <li class=&quotmars&quot></li> <li class=&quotjupiter&quot></li> <li class=&quotsaturn&quot></li> <li class=&quoturanus&quot></li> <li class=&quotneptune&quot></li> </ol>

ما از یک لیست مرتب استفاده می کنیم ، زیرا سیارات مرتب هستند.

در مرحله بعد سبک پیشفرض ol را unset میکنیم

ol { all: unset; aspect-ratio: 1 / 1; container-type: inline-size; display: grid; width: 100%; }


منظومه شمسیcss
امیدوارم به بهتر شدن کمک کنم. در تلگرام و اینستاگرام پیام بفرست، SeyedAhmaddv - ارشد نرم افزار، توسعه دهنده ری اکت و نکست
شاید از این پست‌ها خوشتان بیاید