ウェブデザインにおけるline-heightってけっこう曲者で、CSSを理解してデザインしないと「空き」の設計が破綻したりコーディングで苦労することになります。FigmaやAdobe XD、Affinity Designerなどのグラフィックアプリでline heightの扱いが異なるので、使うツールの挙動を理解するのも大切です。 ということで、今回はCSSのline-heightについてまとめてみます。 実は調べれば調べるほど奥が深いCSSのline-heightの世界ですが、まずは基礎からまとめていこうと思います。 目次 以下はページ内のセクションへのリンクです。 CSSのline-heightでは文字の上下にスペースができる ウェブで使われるハーフ・レディングとは 印刷とウェブにおけるレディングの違い デザインツールでのline heightの扱いの違い 上下のハーフ・レディングを帳
WebP・AVIFの解説 WebPとは？ WebP（ウェッピー）、Googleが開発した画像圧縮フォーマットです。このフォーマットは、JPEGやPNGと比べて画像サイズを大きく削減できるのが特徴です。WebPは、特にウェブサイトで使用される画像に最適化されており、圧縮率が高いにもかかわらず、画質を保つことができます。 Googleが開発している画像フォーマット「.webp」です。下記の特徴があります。 非可逆圧縮（jpegと同じ） 画像の圧縮率が高い（jpegから30%程度圧縮） 背景透過に対応 アニメーション（gifのような）に対応 主要ブラウザは対応済 Google Chrome、Safari、Firefox、Microsoft Edge、Operaなどの比較的新しいバージョンのブラウザでは対応していますが、IEや古いバージョンのブラウザでは対応していません。IEや比較的古いバージョン
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
