ソースコードをブログに載せる際に指定したCSSの覚書き

▶ in IT関連 posted 2016.03.18 Friday / 04:43

ExcelVBAのソースコードをそのままブログに埋め込もうとしたら困ったことが2点ほど。

 

  • 横に長いコードが途中で改行されてしまう
  • 行間が広すぎて見づらい

 

どうにかできないかなと調べてみたら、pre要素、CSSで簡単に指定できました。

 

pre要素へのスタイル指定

<pre>タグで、一定の高さ、幅を超えたらスクロールバーを表示させて、行間を狭くするCSSです。


このブログでは、下記のように指定しています。

 

pre {
  /* 最大高と最大幅 */
  max-height: 200em;
  max-width: 50em;
  /* 行間 */
  line-height: 70%;
  /* 領域をはみ出た場合にスクロールバー出現 */
  overflow: auto;
}

 

code要素と一緒に使う

<code>~</code>は、等幅フォントになります。
ソースコードのインデントや空白を、そのまま表示させるためpre要素と一緒に使用します。


<pre>
<code>
ここにソースコード
</code>
</pre>



表示サンプル




Private Sub 並び替え()

Dim sheetobj As Worksheet
Set sheetobj = ActiveWorkbook.Worksheets("WORK")

Application.ScreenUpdating = False

'優先順位「①○○○○」「②××××××」「③△△△△△△△」「④□□□□□□□」で昇順にソートする
With sheetobj
.Sort.SortFields.Clear
.Sort.SortFields.Add Key:=Range("A:A"), _
SortOn:=xlSortOnValues, Order:=xlAscending, DataOption:=xlSortNormal
.Sort.SortFields.Add Key:=Range("B:B"), _
SortOn:=xlSortOnValues, Order:=xlAscending, DataOption:=xlSortNormal
.Sort.SortFields.Add Key:=Range("K:K"), _
SortOn:=xlSortOnValues, Order:=xlAscending, DataOption:=xlSortNormal
.Sort.SortFields.Add Key:=Range("C:C"), _
SortOn:=xlSortOnValues, Order:=xlAscending, DataOption:=xlSortNormal
End With
With ActiveWorkbook.Worksheets("WORK").Sort
.SetRange Range("A:K")
.Header = xlYes
.MatchCase = False
.Orientation = xlTopToBottom
.SortMethod = xlPinYin
.Apply
End With

Application.ScreenUpdating = True

End Sub



Trackbacks

Trackback URL : http://long-distance.jp/sb/sb.cgi/50


PAGE TOP