آیا تا به حال CSS را روی یک عنصر اعمال کرده اید اما کار نمی کند؟
با Chrome DevTools، میتوانید مشکلات CSS را در یک نگاه کشف کنید، اشکالزدایی و آزمایش کنید.
ویدیو را تماشا کنید تا بدانید چگونه پنجره Elements > Styles مسائل مختلف CSS را برجسته می کند:
ویژگی با نحو نامعتبردارایی لغو شدهدارایی غیرفعال
از
parent
به ارث رسیده است- دارایی موروثی
- اموال غیر ارثی
اموال مختصر قابل گسترش
-
دارایی دست دراز نادیده گرفته شده - اموال دست بلند فعال
-
شیوه نامه عامل کاربر
- دارایی غیر قابل ویرایش
-
دارایی غیر قابل ویرایش لغو شد
نکات بیشتر برای رفع اشکال:
- از فیلتر موجود در بخش Styles برای تمرکز بر روی ویژگی مورد علاقه خود استفاده کنید.
- برای مشاهده تمام برندگان Cascade و مقادیر محاسبه شده آنها از صفحه Computed استفاده کنید.
- در قسمت Computed ، یک ویژگی را گسترش دهید و روی یک پیوند کلیک کنید تا منبع آن را در صفحه Styles پیدا کنید.
برای اطلاعات بیشتر در مورد همه روشهایی که DevTools مسائل CSS را برجسته میکند، به یافتن CSS نامعتبر، لغو، غیرفعال و سایر CSS مراجعه کنید.
برای ارتقاء سطح تخصص خود در CSS، به یادگیری CSS مراجعه کنید.
برای یادگیری نحوه ایجاد وبسایتهایی که عالی به نظر میرسند و برای همه خوب کار میکنند، به یادگیری طراحی واکنشگرا مراجعه کنید.