bookmark_borderbookmark
Stay organized with collections
Save and categorize content based on your preferences.
Sofia Emelianova
CSS-containerquery's zijn de nieuwe CSS-functie waar webontwikkelaars enthousiast over zijn. Het kan een revolutie in webontwerp teweegbrengen: van paginagebaseerd responsief ontwerp naar containergebaseerd responsief ontwerp .
Chrome DevTools is er om u te helpen nieuwe lay-outontwerppatronen te gebruiken en op de hoogte te blijven van de nieuwste trends. Met de ondersteuning van deze CSS-functie kunt u nu uw containerquery's in DevTools inspecteren en fouten opsporen.
De video hierboven geeft u een overzicht van containerquery's, hun syntaxis en hoe u deze in DevTools kunt inspecteren.
Je kunt nu containerelementen en hun afstammelingen ontdekken met de bijbehorende badge die een stippellijn-overlay in- of uitschakelt.
Inspecteer @container -regels die worden toegepast op afstammelingen wanneer containers voldoen aan de queryvoorwaarden.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Translation issue","translationIssue","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2022-06-30 UTC."],[],[]]
