Rumah > hujung hadapan web > tutorial css > Cabaran Frontend: Angkasa.

Cabaran Frontend: Angkasa.

DDD
Lepaskan: 2024-09-14 06:18:32
asal
397 orang telah melayarinya

Frontend Challenge: Space.

Saya masih mengusahakan perkara ini, tetapi ingin mencuba membina di tempat awam. Tetingkap codepen memotong bahagian imej jadi klik butang .5x.

Ini ialah penyerahan untuk Frontend Challenge v24.09.04, CSS Art: Space.

Inspirasi

Cabaran adalah ruang jadi saya mulakan dengan latar belakang untuk ruang. Saya tidak mahu hitam tulen jadi bermain dengan latar belakang hitam, biru dan ungu: kecerunan linear. Saya akhirnya mendapat sesuatu yang lebih menggembirakan daripada #000 hitam.

Demo

Ini codepen saya. Saya boleh bertukar kepada hanya menyiarkan kod di sini apabila saya selesai.


Tetingkap codepen memotong bahagian imej jadi klik butang .5x.

Perjalanan

Saya menggunakan semula beberapa kod semasa cabaran musim panas di mana saya melukis matahari terbenam di pantai. Kecerunan warna di bawah matahari, mengingatkan saya kepada bintik merah pada Musytari.

Saya menambah tempat dengan bermain dengan lebih banyak warna. Saya tidak mahu melakukan sistem suria sebenar dan mahukan versi ruang yang lebih bergaya. Pada mulanya saya mahukan planet bertindih.

Apabila saya membuat planet kuning, putih memberikannya lebih mendalam. jadi saya menambah sorotan ke atas planet seperti Musytari.

Seterusnya saya menambah bukaan lubang cacing yang membenarkan kapal memasuki galaksi. Lubang cacing ialah bujur dengan perubahan: condong untuk memberikan lubang itu sedikit dalam.

Bungkus

Saya sangat menyukai cabaran bahagian hadapan ini. Ia sentiasa bagus untuk menunjukkan sedikit kreativiti dalam projek.

Atas ialah kandungan terperinci Cabaran Frontend: Angkasa.. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

sumber:dev.to
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan