CSSで角丸を美しく実装するテクニック、ネストされた外側と内側を相対角丸の美しいバランスで実装
カードやパネルの外側と内側に角丸を使用したときに、なんだかバランスが悪いなと思ったことはありませんか？ 角丸を二重にするときに外側の角丸と内側の角丸の値を同じに設定すると、内側の方がすこし大きく見えて、不格好になってしまいます。 外側の角丸と内側の角丸を美しいバランスで実装する相対角丸のテクニックを紹介します。 まずは、ネストされた角丸を美しいバランスで実装したデモをご覧ください。 See the Pen Inner Radius Design Tip with CSS Custom Properties by coliss (@coliss) on CodePen. 外側の角丸と内側の角丸を美しいバランスで実装するポイントは、「外側の半径 = 内側の半径 + パディング」に設定することです。こうすることで、外側の角丸と内側の角丸の中心点が同じになり、美しいバランスになります。 ちなみに、
BtoB商材のLP（ランディングページ）の標準ワイヤーフレーム｜テンプレート集｜BtoBサイト改善ガイド
サイト訪問者が最初にアクセスするページをランディングページ（LP：エルピー）と呼びます。広告のリンク先として作成されることが多く、BtoB商材においても多くの企業が作成しています。 本記事では、ランディングページの企画やラフ案制作を担当される方向けに、構成・デザインの指針となる標準ワイヤーフレームのテンプレートを公開します。 LPワイヤーフレーム（PowerPoint形式）のダウンロードはこちら LPワイヤーフレーム（XD形式）のダウンロードはこちら ※個人情報の入力なし。無料でダウンロードできます ランディングページから訪問者にコンバージョンしてもらうために、成功ポイントが詰まったワイヤーフレームになっています。ぜひご活用ください。 なお、本記事と標準ワイヤーフレームは、株式会社WACUL 取締役CIO 垣内 勇威様（@yuikakiuchi）に監修をいただきました。 BtoBサイト改善
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
