دسترسی نامحدود
برای کاربرانی که ثبت نام کرده اند
برای ارتباط با ما می توانید از طریق شماره موبایل زیر از طریق تماس و پیامک با ما در ارتباط باشید
در صورت عدم پاسخ گویی از طریق پیامک با پشتیبان در ارتباط باشید
برای کاربرانی که ثبت نام کرده اند
درصورت عدم همخوانی توضیحات با کتاب
از ساعت 7 صبح تا 10 شب
ویرایش:
نویسندگان: Shruti Balasa
سری:
ناشر: Gumroad
سال نشر: 2021
تعداد صفحات: 175
زبان: English
فرمت فایل : PDF (درصورت درخواست کاربر به PDF، EPUB یا AZW3 تبدیل می شود)
حجم فایل: 20 Mb
در صورت تبدیل فایل کتاب CSS Flex & Grid: Complete Guide with Real World Examples and Code Snippets (Tailwind CSS) به فرمت های PDF، EPUB، AZW3، MOBI و یا DJVU می توانید به پشتیبان اطلاع دهید تا فایل مورد نظر را تبدیل نمایند.
توجه داشته باشید کتاب CSS Flex & Grid: راهنمای کامل با مثالهای دنیای واقعی و قطعات کد (Tailwind CSS) نسخه زبان اصلی می باشد و کتاب ترجمه شده به فارسی نمی باشد. وبسایت اینترنشنال لایبرری ارائه دهنده کتاب های زبان اصلی می باشد و هیچ گونه کتاب ترجمه شده یا نوشته شده به فارسی را ارائه نمی دهد.
با CSS Flexbox و Grid در ساخت اجزا و طرحبندیها حرفهای شوید. با نگاه کردن به فهرستی از بیش از 70 مورد استفاده در دنیای واقعی و مثال توضیح داده شده در Tailwind CSS بیاموزید. برای همه نمونهها با نسخههای نمایشی کار به پیوندهای کدپن خصوصی دسترسی پیدا کنید. \"همه چیزهایی که CSS flexbox و grid میتوانند برای شما انجام دهند را فقط یاد نگیرید. در عوض همه چیزهایی را که میتوانید با آنها انجام دهید یاد بگیرید.\" چرا این کتاب؟ اکثر آموزش های موجود در وب مفاهیم CSS Flexbox و Grid را با استفاده از بلوک های رنگی آموزش می دهند. شما با تمام ویژگی های CSS مربوط به این مفاهیم و نحوه کار آنها آشنا می شوید. اما به ندرت می توانید نمونه هایی از مکان و نحوه استفاده از آنها در دنیای واقعی را ببینید. بدون درک کاربرد دنیای واقعی، یادگیری ناقص است. این کتاب رویکردی کاملا متفاوت دارد. من کارهایی را که فلکس و گرید می توانند انجام دهند را به شما یاد نمی دهم. در عوض، ابتدا به شما چند مؤلفه و طرحبندی را نشان میدهم و به شما میخواهم تا با استفاده از مفاهیم CSS که قبلاً میشناسید، آنها را بسازید. حالا شما یک مشکل دارید و راه حل می خواهید. آن زمان است که مفاهیمی را که شما \"نیاز دارید\" بدانید را معرفی می کنم. این یادگیری مبتنی بر مشکل نامیده می شود که نه تنها شما را در سراسر کتاب با انگیزه نگه می دارد، بلکه به شما کمک می کند تا دانش را بسیار بهتر حفظ کنید. این کتاب مال کیه؟ چه یک مبتدی در CSS باشید که هرگز در مورد flex و grid چیزی نشنیده باشید، یا کسی که همه مفاهیم را میداند اما اجرای آن در پروژههای واقعی سخت است، یا در هر نقطهای از این بین، این کتاب برای شما مناسب است. حتی اگر اینجا هستید تا فقط به چند نمونه نگاه کنید و مهارت های خود را تمرین کنید، یک مجموعه عالی در اینجا خواهید یافت.
Become a Pro at building components & layouts with CSS Flexbox and Grid. Learn by looking at a curated list of 70+ real world use cases and examples explained in Tailwind CSS. Gain access to Private CodePen links with working demos for all examples. "Don’t just learn all the things CSS flexbox and grid can do for you. Instead learn all the things YOU can do with them." Why this book? Most of the tutorials on the web teach the concepts of CSS Flexbox and Grid using some coloured blocks. You get introduced to all the CSS properties related to these concepts and how they work. But very rarely you get to see some examples of where and how these are used in the real world. Without understanding the real world application, learning is incomplete. This book takes a completely different approach. I won't teach you the things flex and grid can do. Instead, I will first show you some components and layouts and make you think how to build them using the CSS concepts you already know. Now you have a problem, and you want a solution. That's when I introduce the concepts you "need" to know. This is called Problem-Based Learning which will not only keep you motivated throughout the book, but also help you retain the knowledge far better. Who is this book for? Whether you are a beginner at CSS who's never heard of flex and grid, or someone who knows all the concepts but finding it hard to implement in real projects, or anywhere in between, this book is for you. Even if you're here to just look at some examples and practice your skills, you will find a great collection here.
Complete Guide to CSS Flex & Grid - Tailwind CSS Disclaimer About the Author Table of Contents Introduction Time for another approach Who is this book for? Prerequisites What not to expect How to use this book? Flow of the book Newbie's Guide Intermediate's Guide Tailwind CSS Version Used Tailwind Play Links Reach Out Why Flex and Grid The Problem What you might already know The Solution 1 Display Flex Quotes Side-by-Side Example 1a Understanding Display Flex Concept 2 Justify Content Tabs Spaced Out Example 2a Understanding Justify Content Concept Card with Previous & Next Links Example 2b Team Profiles Example 2c 3 Flex Wrap Responsive Team Profiles Example 3a Understanding Flex Wrap Concept Logos Wrapped Example 3b 4 Align Items Icon and Text Example 4a Understanding Align Items Concept Profile Card - Small Example 4b Services Section Example 4c Frequent Questions Example 4d Center a div Example 4e 5 Flex Direction Welcome Screen Example 5a Understanding Flex Direction Concept Main Axis and Cross Axis Testimonial Card Example 5b Alternating List of Profiles Example 5c 6 Flex Grow Inline Subscribe Form Example 6a Understanding Flex Grow Concept Sticky Footer Example 6b Card with Header & Footer Example 6c Tabs Hover Effect Example 6d Variable Width Responsive Buttons Example 6e 7 Flex Shrink Itinerary Example 7a Understanding Flex Shrink Concept Profile Card - Large Example 7b 8 Flex Basis Split Screen Display Example 8a Understanding Flex Basis Concept Blog Post Display Example 8b Pricing Plans Example 8c Spaces between the blocks 9 Flex Shorthand Property Understanding FlexConcept Navigation Bar with Centered Menu Example 9a Image and Text in 2:1 Ratio Example 9b 10 Auto Margins Notifications Menu Item Example 10a Footer with Multiple Columns Example 10b 11 Order Responsive Navigation Bar Example 11a Understanding Order Concept 12 Align Self Product Display Example 12a Understanding Align Self Concept Profile with Rating Example 12b 13 Align Content Full Page Testimonials Section Example 13a Understanding Align Content Concept 14 Inline Flex Social Media Icons Example 14a Understanding Inline Flex Concept Flexbox Unlocked! Comprehensive Examples for Flexbox Article Preview Example 15a Fitness Report Example 15b Tweet Example 15c 16 Display Grid & Grid Template Columns Full Page Gallery Example 16a Understanding Display Grid Concept Understanding Grid Template Columns Concept The CSS Property grid-template-columns & Values Layout with Sidebar Example 16b The fr Unit Services Grid Example 16c Quick Bites Menu Example 16d 17 Grid Template Rows Sticky Footer with Grid Example 17a Understanding Grid Template Rows Concept 18 Gap Pricing Plans with Grid Example 18a Understanding Column Gap Concept Blog Posts Display Example 18b Understanding Row Gap Concept Understanding Gap Concept 19 Justify Content Featured Logos in a Grid Example 19a Understanding Justify Content in Grid Concept Shopping Cart Summary Example 19b 20 Align Content Profile Card with Bio & Link Example 20a Understanding Align Content in Grid Concept Featured Logos Center of Page Example 20b Understanding Place Content in Grid Concept 21 Justify Items Featured Logos of Different Widths Example 21a Understanding Justify Items Concept Profile Card with Bio & Link Centered Example 21b 22 Align Items Image and Text Section Example 22a Understanding Align Items in Grid Concept Featured Logos of Different Heights Example 22b 23 Place Items Center a div using Grid Example 23a Understanding Place Items Concept 24 Grid Column Start, End & Span Horizontal Form Example 24a Understanding Column Start Concept Single Price Grid Component Example 24b Understanding Column End Concept Understanding Column Span Concept Page Layout with Grid Example 24c 25 Grid Row Contact Form Example 25a Understanding Row Start and Row End Concept Understanding Row Span Concept Responsive Services Section Example 25b Testimonials Grid Section Example 25c 26 Order Responsive Pricing Plans Example 26a Understanding Order in Grid Concept 27 Advanced Grid Template Values Pricing Plans with Size Limits Example 27a Understanding minmax() Concept Blog Post Page with Code Snippet Example 27b Responsive Grid without Media Queries Example 27c Understanding auto-fit Concept Understanding auto-fill Concept 28 Grid Auto Flow Analytics Section Example 28a Understanding Grid Auto Flow Concept 29 Justify Self & Align Self Restaurant Cards with Labels Example 29a Understanding Justify Self and Align Self Concept Caption at the Bottom of Image Example 29b Comprehensive Examples for Grid & Flexbox Services Section Example 30a Twitter Monthly Summary Card Example 30b Social Media Dashboard Example 30c Conclusion