2019-2-12

[CSS]style属性くんそんな悪いやつじゃないじゃんって話

雑な技術メモ

「style 属性つかうやつは糞」みたいな言葉を HTML/CSS 学び始めた初期に頻繁に見て悪いイメージしか無かったんだけど、最近は使い所に気をつければめちゃくちゃ良いんじゃないかって思い始めたのでメモ。

style 属性を使うべきパターン

  • その場所でしか出てこないような例外的なデザイン
  • style 属性へのプロパティ適用が 2 個程度に収まる

上記の条件を満たしているなら使っても良いんじゃないかなと。

具体例

Demo

  • .Table及び.Tagコンポーネントが既に存在している
  • コンポーネントを素直に使った実装は上
  • 下側のように「タグだけ右寄せしたい」という要望が出たとする

この場合、style 属性を使わないなら要望を満たすためにそれ専用に CSS ファイルを弄る必要が出てくる。しかし style 属性を許容すれば、HTML に少し CSS を書くだけで済む。

個人的には CSS ファイルがちょっとした例外のために肥大化するのは良くないと思っているので、style 属性で済むなら style 属性でいいのではと思った。

もちろん、最初にも書いたとおり「その場所でしか出てこないような例外的なデザイン」かつ「style 属性へのプロパティ適用が 2 個程度に収まる」という前提を満たす必要はある。なんでもかんでも style 属性でやるとそれは地獄になってしまう。