ソースコード、実行結果の表示スタイル

コンピュータ関連技術に関する記事を掲載する場合、ソースコードや実行結果の表示方法を整える必要があります。本サイトでは、CSSで以下の定義をしています。

pre.code { 	width:95%; 	padding: 10px 15px; 	margin: 5px 0 15px; 	border-left: 5px solid #999999; 	color: #FFFFFF; 	background: #000000; 	font: 1em/1.5 "Courier News", monospace; 	overflow:scroll; }

テンプレートを変更するには、サイト管理者になって「エクステンション」の「テンプレート管理」を使います。例えばJa_Purityテンプレートの場合、「Ja_purity」を選択して、「テンプレート編集」「CSS編集」ボタンを押して、テンプレートCSSエディタの一覧画面を表示させ、template.csを選択し「編集」ボタンを押します。以下の定義の下(200行目あたり)に、上のpre.codeクラスの定義を追加します。

/* BONUS TYPOGRAPHY STYLES --------------------------------------------------------- */ pre, .code { 	padding: 10px 15px; 	margin: 5px 0 15px; 	border-left: 5px solid #999999; 	background: #FFFFFF; 	font: 1em/1.5 "Courier News", monospace; } 

コメントを残す

メールアドレスが公開されることはありません。