本月Firefox 65 將加入Flexbox Inspector 開發者工具
計劃於本月29日發布的Firefox 65開發者工具中將加入Flexbox Inspector功能。Flexbox Inspector是一個新的開發者工具,可幫助開發者了解Flebox元素的大小、位置與嵌套情況。CSS Flexbox(彈性盒子)是一種越來越流行的佈局模型,它是一種用於在行或列中佈局元素的一維佈局方法,彈性元素可填充頁面額外空間,也可以適當收縮以適合較小的空間,有助於構建強大的動態頁面,但是它的學習曲線非常陡峭。
開發者在一篇博客上具體介紹了該功能的研發背景與特性。作者說Fle Xbox的難度之大,甚至當初團隊在開始Flexbox Inspector項目的時候都不確定自己足夠了解Flexbox,也不清楚將面臨什麼困難。
經過一系列研究與設計,最終完成了Flexbox Inspector 項目,作者表示,花了很大精力去做這個功能之後,他們擔心它會被淹沒在龐大的Firefox 開發者工具集裡,使得人們無法找到它或者不想去使用它。於是他們對此採取了積極主動的態度:只要開發者在標記視圖中選定了Flex 容器或其它元素,那麼就會自動出現Flexbox 信息,開發者可以在佈局面板中的Inspector 標籤下看到相應內容。
目前該功能可以在Firefox 開發者版本中試用,更具體內容查看原博客: