Compass(Sass)で見出しタグを一括スタイル指定する

goto_jp 485views 更新:2014年4月1日

Compassにはh1~h6の見出し用タグを一括して処理する関数があります。

Sass記述

#{headings()} {
  display: inline-block;
}
#{headings(4)} { //h1からh4までの4個を指定
  font-size:30px;
}
#{headings(3, 4)} { //h3とh4を指定
  color: #069;
}

出力CSS

h1, h2, h3, h4, h5, h6 {
  display: inline-block;
}
h1, h2, h3, h4 {
  font-size: 30px;
}
h3, h4 {
  color: #069;
}

直接書いてもあまり大きな手間の差は無いように思えますが、徹底して記述量を減らしたい人はお試しください。

 

ログイン / 新規登録してコメントする

このソースコードをストックして後で利用したり、作業に利用したソースコードをまとめることができます。

こちらもお役に立つかもしれません