先週リリースされた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など)を探します。 単位にカーソルを合わせる