生活情報オンライン

ソフトウェアエンジニアが役立つ情報を発信します。

スタイルシート(css)上で計算して値を設定する方法

スタイルシートcss)上で計算して値を設定する方法をご紹介します。



スタイルシートcss)の値を記載するところに、calc(計算式)といった具合に記載します。


例:

/* 横幅を設定 */
width: calc(100% - 8px);



上記の例では計算して値を算出、算出した値を横幅に設定しています。


これで簡単に計算した値を設定することが出来ます。

プロとして恥ずかしくない 新・CSSデザインの大原則

プロとして恥ずかしくない 新・CSSデザインの大原則