「CSS3入門」column-ruleのサンプル
書式
column-rule は一括指定を行う CSS のプロパティで、段組みレイアウトで段間に引かれる線の太さ、スタイル、色を設定します。
使用例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>test sample</title> <style> .newspaper { -moz-column-count:3; /* Firefox */ -webkit-column-count:3; /* Safari and Chrome */ column-count:3; -moz-column-gap:40px; /* Firefox */ -webkit-column-gap:40px; /* Safari and Chrome */ column-gap:40px; -moz-column-rule:4px outset #ff00ff; /* Firefox */ -webkit-column-rule:4px outset #ff00ff; /* Safari and Chrome */ column-rule:4px outset #ff00ff; } </style> </head> <body> <p><b>111:</b>222</p> <div class="newspaper"> AA BB CC DD EE </div> </body> </html>