همونطور که قول داده بودم
سلام دوستان به قسمت اول خوش اومدید
این دوره دوره ی مقدماتی هستش و فقط در حد آشنایی اما با همین دوره هم میتونید صفحه بندی عالی داشته باشید
گرید رو توی مطلب قبل معرفی کردیم
کسایی که خیلی وقته با css آشنا هستن میدونن که صفحه بندی چقدر سخته -_-
با ابزار هایی مثل float و margin باید این کار رو میکردیم -_-
خلاصه مدتی به این سختی گذشت که ابزاری به اسم فلیکس باکس اومد که فوق العاده کمکمون کرد
اما بازم یادگیریش نسبتا سخت بود
تا اینکه css3 ابزار grid رو معرفی کرد
این ابزار عنصرمون رو به شکل یک جدول تقسیم بندی میکنه
سپس ما فرزندان مستقیم عنصر رو (توجه کنید فقط فزندان مستقیم عنصر) توی اون ستون ها و ردیف های جدول میزاریم
نمونه ی زیر رو نگاه کنید
<div class="web"> <div class="header"></div> <div class="main"><div class="post"></div></div> <div class="footer"></div></div>
در این مثال web همون عنصریه که جدول بندی توش انجام میشه
ما گرید رو روی هدر فوتر و ماین انجام میدیم اما تاثیری روی دیو پست نداره
این یک توضیح مختصر از grid بود اما بزودی اموزش کاملشو میدم
ی نمونه قالب هم درست کردم با GRID که میزارمش
اگه میخواین یه بار برای همیشه از شر گشتن دنبال کد رنگ راحت شید این مطلب رو بخونید
برو به بخش آپدیت
img { transition: all .4s ease; } img:hover { transform: scale(1.1); }
دیدین وقتی رو تصاویر ویمون کلیک مزکنید یا موس رو میبرید روش بزرگ میشه؟
کافیه این کد رو توی css وبتون بزنید تا عکسای شما هم این مدلی بشه
body { background: #FFF; filter: invert(1) hue-rotate(210deg); }
استفاده ی متفاوت گیمر و برنامه نویس از کیبورد XD
برید ادامه....
برای شما هم سوال شده چجوری دور یه عنصر خط بکشیم؟
سوال شده چجوری رنگ،شکل زخامت و... عوض کنیم؟
تو این مطلب جواب سوالتون رو پیدا کنید
سلام دوستان
میخوام با یکی از چیزهای جالب css آشناتون کنم
سفارشات خود را از بخش سفارشات در منوی بالا دریافت کنید