先週リリースされたChrome 95のデベロッパーツールに搭載された新機能が便利なので、紹介します。 最近の新機能だと、Flexboxのデバッグツール(紹介記事)やCSS Gridのデバッグツール(紹介記事)などがありますが、Chrome 95ではCSSの単位(vh, vw, rem, emなど)を簡単にオーサリングできるようになりました。 New CSS length authoring tools ※デベロッパーツールの日本語表示(Chrome 94の新機能)は、設定(歯車アイコン)から言語を日本語に変更します。 デベロッパーツールの新機能の使い方は、簡単です。 Webページを開き、デベロッパーツールを起動します。 スタイル(Styles)パネルで、長さを定義したCSSのプロパティ(width, height, margin, paddingなど)を探します。 単位にカーソルを合わせる
![Chrome 95のデベロッパーツールの新機能が便利!vh, vw, rem, emなど、CSSの単位を簡単にオーサリング](https://cdn-ak-scissors.b.st-hatena.com/image/square/a78b47e538d1ae82828a03723a16b141c531288c/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-202104%2F2021102301.png)