بایگانی فروردين ۱۴۰۴

۷ مطلب در فروردين ۱۴۰۴ ثبت شده است

گرید CSS: راهنمای مبتدی برای چیدمان حرفه‌ای

گرید CSS یه سیستم چیدمان دوبعدیه که با display: grid شروع می‌شه و بهت اجازه می‌ده ردیف‌ها و ستون‌ها رو با grid-template-columns و grid-template-rows تنظیم کنی. تو یه مثال، یه صفحه با هدر، سایدبار، محتوا و فوتر ساختیم که تو موبایل عمودی می‌شه. گرید چیدمان پیچیده رو ساده و ریسپانسیو می‌کنه؛ دست به کد بزن و با این ابزار، سایتت رو حرفه‌ای بچین!

۲۶

فروردين

۰ نظر

وحید

فرق margin و padding تو CSS چیه؟

تو CSS، padding فاصله داخلی یه عنصر رو تنظیم می‌کنه و بین محتوا و لبه جعبه قرار می‌گیره، مثل فضای دور متن تو دکمه، که تو پس‌زمینه هم دیده می‌شه. Margin فاصله خارجیه و عنصر رو از بقیه جدا می‌کنه، بدون اینکه جزو جعبه باشه یا رو رنگ اثر بذاره. تو یه مثال، با padding دکمه رو بازتر کردیم و با margin پاراگراف رو ازش دور کردیم. دست به کد بزن و با این دو، فاصله‌ها رو تو سایتت مثل حرفه‌ای‌ها تنظیم کن!

۲۴

فروردين

۰ نظر

وحید

ساختار یه سایت رو با HTML بشناس

HTML اسکلت هر صفحه وب رو می‌سازه و با تگ‌هایی مثل <head> برای اطلاعات پشت صحنه و <body> برای محتوای قابل دیدن، ساختار سایت رو مشخص می‌کنه. تگ‌های معنایی مثل <header>، <nav>، <main> و <footer> به نظم و سئو کمک می‌کنن. تو این مقاله یه صفحه ساده با هدر، منو، محتوا و فوتر ساختیم تا ببینی هر بخش کجا می‌ره. با دست به کد، ساختار HTML رو یاد بگیر و پایه سایتت رو محکم کن!

۱۷

فروردين

۰ نظر

وحید

جاوااسکریپت برای مبتدی‌ها: اولین اسکریپتت رو بنویس

جاوااسکریپت زبانیه که سایتت رو تعاملی می‌کنه؛ از تغییر متن تا عوض کردن رنگ دکمه. تو این مقاله با یه فایل HTML و یه فایل .js، اولین اسکریپتت رو می‌نویسی که با کلیک دکمه، پیام نشون می‌ده. مفاهیمی مثل متغیرها (let)، توابع و رویدادها رو یاد می‌گیری و با یه پروژه ساده، رنگ دکمه رو تغییر می‌دی. جاوااسکریپت ساده‌ست و با تمرین، می‌تونی سایتت رو زنده کنی. دست به کد بزن و از همین امروز شروع کن!

۱۳

فروردين

۰ نظر

وحید

CSS از صفر: استایل دادن به سایتت رو یاد بگیر

CSS یا 'Cascading Style Sheets' زبانیه که بهت کمک می‌کنه ظاهر سایتت رو با رنگ، فونت، چیدمان و حتی انیمیشن طراحی کنی. با یه فایل HTML و یه فایل .css، می‌تونی استایل‌هایی مثل color: blue; یا font-size: 18px; به عناصر بدی و با ابزارهایی مثل فلکس‌باکس و گرید، صفحه‌ات رو منظم کنی. تو این مقاله از صفر شروع کردیم، یه کارت ساده با تیتر، متن و دکمه ساختیم و ترفندهایی مثل مدیا کوئری برای ریسپانسیو کردن یاد گرفتیم. دست به کد بزن و با CSS، سایتت رو از یه اسکلت ساده به یه طراحی جذاب تبدیل کن!

۱۰

فروردين

۰ نظر

وحید

چطور با CSS انیمیشن ساده بسازی؟

با CSS می‌تونی به سایتت حرکت بدی؛ از تغییر نرم با transition (مثل بزرگ شدن دکمه با هاور) تا انیمیشن پیچیده با @keyframes (مثل چرخیدن یه مربع). تو این مقاله یاد گرفتی با transition: transform 0.3s تغییرات ساده بسازی و با @keyframes مراحل انیمیشن رو خودت تعریف کنی. یه دکمه پرشی هم ساختیم که با کلیک حرکت می‌کنه. دست به کد بزن و با چند خط CSS، سایتت رو زنده کن!

۰۸

فروردين

۰ نظر

وحید

HTML چیه و چطور شروعش کنم؟

HTML یا زبان نشانه‌گذاری ابرمتن، اسکلت هر صفحه وب رو می‌سازه و با تگ‌هایی مثل <h1> برای تیتر و <p> برای پاراگراف، به مرورگر می‌گه چی کجا باشه. برای شروع، فقط به یه فایل متنی با پسوند .html و یه مرورگر نیاز داری. کافیه یه کد ساده مثل <h1>سلام دنیا!</h1> بنویسی، فایل رو ذخیره کنی و بازش کنی تا اولین صفحه‌ات رو ببینی. با دست به کد، از همین امروز HTML رو یاد بگیر و وب‌سازی رو شروع کن!

۰۸

فروردين

۰ نظر

وحید

دست به کد، شروع وب‌سازی تو!

۷ مطلب در فروردين ۱۴۰۴ ثبت شده است