見出し画像

点線(破線)の採用差分はなんだろう

■事例と質問

□ dottedを想定してdotとその間が縦横均等な点線でデザインした時にdashedになっていた事が過去に何度かありました。ブラウザ互換的にも問題なさそうなのですがこれは点線に対する意図が伝わっていないためか、dashedあるべき条件などがあるのかをその時ちゃんと確認できていなかったのでフロントの観点で教えてもらえると嬉しいです。

※うっすらとですが昔dottedはなんか制約があって背景画像使った記憶はあります。

■デザイン的な意図

dotとその間が縦横均等であるデザインは正円や正方形のリズムを持った意匠に対してトーンの一貫性を保ち画面全体の統一感に貢献します。

■参照

□ border-style - CSS: カスケーディングスタイルシート | MDN
https://developer.mozilla.org/ja/docs/Web/CSS/border-style
□text-decoration-style-CSSリファレンス
http://www.htmq.com/css/text-decoration-style.shtml
□ dottedでもdashedでもない!CSSで好きな間隔の点線(破線)を作る方法 | amelog
https://www.ameamelog.com/css-dotline/

いいなと思ったら応援しよう!