sidebar menu example

جامعه‌ها وبلاگ شروع یادگیری برنامه نویسی

درود، وقت بخیر.

می تونید راهنمایی کنید چطور منوم رو مثل نمونه زیر در بیارم؟

تمرینِ من:

https://codepen.io/Sahar_Pashaei/pen/oNmwWLb

درود

مشخص نکردید که دقیقا کدوم بخش میخواد مشابهش باشه، پس فرض رو بر این میگیرم که بخش هاور هست.

برای هاور اگر دقت کنید میبینید که موقع هاور با یکم شیفت رنگ تغییر میکنه و همچنین گوشه‌ها گرد هستند، پس باید با دو ویژگی transform و border-radius کار کنید.

برای اطلاع دقیقتر از کد، کافیه کدپن اصلی رو باز کنید و روی هر بخش (html و css) کنار دکمه تنظیمات، اون دکمه فلش پایین رو بزنید و کد رو روی حالت view compiled css/ html بذارید.

بهترین پاسخ

بلاش بخاری ۲۳ آبان ۱۴۰۲، ۱۹:۴۷

خیلی ممنون

+ و این که متن‌های کنار آیکون در حالت عادی مخفی هستن و با کلیک نشون داده می‌شن رو متوجه نشدم به چه صورته

نرگس فرمانفرمائیان ۲۴ آبان ۱۴۰۲، ۰۸:۲۰

خواهش میکنم

برای پنهان کردن متن کلک زده. به این صورت که صرفا میاد اندازه کانتینر رو تغییر میده (با کلیک و بازی با checked) اگر اندازه کانتینر بزرگ بشه متن رو میبینید در غیر این صورت خیر.

بلاش بخاری ۲۶ آبان ۱۴۰۲، ۲۱:۵۶