دکمه Dark mode یک حالتی است که بعضی از سایت ها در اختیار کاربران خود می گذارند و کاربران می توانند سایت آنها را با حالت تیره مشاهده کنند. در گذشته نیز نحوه ی درست کردن دکمه ی شب و […]
امروز قصد داریم نحوه ایجاد یک منوی نوبار ساده را بررسی بکنیم. همچنین منوهای بازشونده یا dropdown را نیز خواهیم گفت. درانتها نوباری را با کمک HTML & CSS ایجاد میکنیم تا با هاورشدن محتویات منوی dropdown نمایش داده بشود. […]
در این آموزش، به یکی از مفاهیم پایه و کلیدی طراحی وب، یعنی گریدبندی صفحات وب با استفاده از HTML و CSS خواهیم پرداخت. گرید بندی HTML یا شبکه‌بندی آن به توسعه‌دهندگان وب امکان می‌دهد تا ساختارهای منظم و متقارن […]
در طراحی صفحات وب بعضا باید ارتفاعی را مشخص کنیم تا عناصر دیگر را شامل بشود. به طور مثال یک فرم را طراحی کرده ایم و می خواهیم در زیر آن یک عکس قرار بدهیم. با استفاده از min height […]
در این آموزش ویدئویی قصد داریم یک باکس ایجاد کنیم که پشت و جلوی این باکس دارای متن متفاوت باشند و با بردن موس بر روی این باکس متن پشت نمایان شود. نام این باکس فلیپ باکس می باشد. شما […]
امروز قصد داریم در این آموزش نحوه ی ایجاد آیکون منو با transform را به شما آموزش دهیم. در ابتدا یک آیکون منو ساده که تشکیل شده از سه خط بر روی یکدیگر هستند را آموزش می دهیم، سپس سراغ […]
از سری آموزش های HTML و CSS سایت تاتژن، امروز در این آموزش قصد داریم نحوه ساخت دکمه همبرگری که به شکل ضربدر در خواهد آمد را آموزش دهیم. تا پایان با این آموزش که کاربردش بعنوان دکمه ی منو […]
در این مقاله به بررسی یکی از تکنیک‌های جذاب و پرکاربرد در طراحی وب، یعنی افزودن گرادینت به پس‌زمینه با CSS خواهیم پرداخت. گرادینت‌ها یا شیب‌های رنگی می‌توانند جلوه‌های بصری بسیار زیبایی به صفحات وب اضافه کنند و با ایجاد […]
در مقاله های گذشته اشاره هایی به مبحث گرادینت کردیم و در یک پروژه به پس زمینه یک صفحه وب سایت گرادینت دادیم. در ادامه می خواهیم گرادینت در CSS را آموزش دهیم و مبحث را تکمیل تر کنیم. گرادینت […]
همانطور که می دانید با کمک های HTML می توانیم ساختار کلی یک صفحه وب را پیاده سازی کنیم. برای استایل دادن و زیباتر کردن آن باید از CSS کمک بگیریم. در ادامه به آموزش استایل دادن به کمک CSS […]
در آموزش امروز قصد داریم تا نحوه ایجاد تصاویر آواتاری که در سایت ها مشاهده می کنید را بررسی کنیم. در انتهای آموزش شما خواهید توانست یک تصویر آواتار همانند زیر ایجاد کنید. پس تا انتها همراه آموزش “ساخت تصویر […]
امروز می خواهیم به شما نحوه تغییر رنگ سایت با یک دکمه بصورت live را آموزش بدهیم شاید به خودی خود این آموزش خیلی کاربردی نباشد، اما ایده ای که به شما می دهد می تواند منتهی به ساخت چیز […]
