カラムをライン(border)で装飾するデザイン

 
Dressでカラム(.column)に対して設定していますので、ブロックレイアウト「目次」で5段までに対応していますが、改行(3カラム・2行の6カラム等)には対応していません。
 
features_006、features_006aともにDRESS版のみとなります。

吾輩は猫である

名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である

名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である

名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

features_006a

吾輩は猫である

名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である

名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。

吾輩は猫である

名前はまだ無い。どこで生れたかとんと見当けんとうがつかぬ。何でも薄暗いじめじめした所でニャーニャー泣いていた事だけは記憶している。


  • カラムに対しては余白ゼロとし、小見出し・本文に対して余白を設定しています。
  • カラムに対して枠線を設定しています。
  • features_006:カラムに対して上下・右の罫線を設定し、カラムの最初の子要素に対してのみ左の線を設定するためにDRESS版のみとなります。
  • features_006a:カラムの左に線を設定し、カラムの最初の子要素に対して左の線なしとする設定をDRESSで行っています。(最初の子要素が必要なのでDRESS版のみとしています)

Tablet View


features_006
 

features_006a

SP View


features_006
 

features_006a