CSS設定

pandocで、md→html＋css→pdf 変換のテスト問題等を作成する際の、CSS設定をメモ。

フォント大きさ

/*フォント大きさ*/
.xxs {font-size: 7pt; }
.xs {font-size: 8pt; }
.s {font-size: 9pt; }
.m{font-size: medium }
.l{font-size:large}
.xl{font-size:x-large}
.xxl{font-size:xx-large}
.smaller { font-size: smaller }
.footnote { font-size: smaller; margin-left: 2em; }
.center { text-align: center }

p{font-size:10pt;
    font-family:"IPAex明朝",serif;
    line-height:1.5;
    padding-left:1em;
    text-align: justify;
    text-justify: inter-ideograph;}

h1見出しに連数字をつける等、見出しの調整

h1::before {
    content: counter(chapter) "．";}

h1{font-size:10pt;
    font-family:"IPAex明朝",serif;
    font-weight:normal;
    line-height:1.5;
    text-align: justify;
    text-justify: inter-ideograph;
    padding-left:1em;
    padding-top:2em;
    text-indent:-1em;
    counter-increment: chapter;
    counter-reset:section;
}

/*　ページ最初の見出し　padding-top:0em;　*/
h1.first{font-size:10pt;
    font-family:"IPAex明朝",serif;
    font-weight:normal;
    line-height:1.5;
    text-align: justify;
    text-justify: inter-ideograph;
    padding-left:1em;
    padding-top:0em;
    text-indent:-1em;
    counter-increment: chapter;
    counter-reset:section;
}

/* h1.pagebreak{
    page-break-before:always;
    padding-top:0em;
    text-align: justify;
    text-justify: inter-ideograph;
}

h2.pagebreak{
    page-break-before:always;
    padding-top:0em;
    text-align: justify;
    text-justify: inter-ideograph;
}
*/

h2{font-size:10pt;
    font-family:"IPAex明朝",serif;
    font-weight:normal;
    line-height:1.5;
    text-align: justify;
    text-justify: inter-ideograph;
    padding-left:2em;
    padding-top:0em;
    text-indent:-1em;
}

文字整形

/*強調*/
em {
    color:black; 
    font-weight:bold;
    font-style:normal;
}

/*下付文字*/
.sita {
    vertical-align: sub;
    margin-right:0.2em;
    margin-right:0.2em;
}

/*下線　取り消し線*/
.underline{text-decoration:underline;}
.overline {text-decoration:overline}
.cancel {text-decoration:line-through}

リンクの文字を消す

a:link { visibility: hidden; }
a:visited { visibility: hidden; }
a:hover { visibility: hidden; }
a:active { visibility: hidden; }

水平線を消す

hr { visibility: hidden; }

ルビ

ruby>rt {
    font-size: 50%;
    text-align: center;
    }

文字間詰め

/** 文字間詰め **/
.tume1 {letter-spacing: -1px;}
.tume2 {letter-spacing: -2px;}
.tume3 {letter-spacing: -3px;}
.tume4 {letter-spacing: -4px;}
.tume5 {letter-spacing: -5px;}

インデント・段落

.左から＋１,.P＋１{padding-left:2em;}
.左から＋２,.P＋２{padding-left:3em;}
.マイナスインデント1{
    padding-left:2em;
    text-indent:-1em;}
.マイナスインデント2{
    padding-left:3em;
    text-indent:-2em;}
.マイナスインデント3{
    padding-left:4em;
    text-indent:-3em;}
.小問{
    padding-left:20pt;
    text-indent:-20pt;}

/* テキスト右寄せ */
.textright { text-align: right; }  

/*引用*/
blockquote{margin-right:20pt;}

リスト

/*リスト*/
ul{list-style-type:circle;}

li{font-size:10pt;
    font-family:"IPAex明朝",serif;
    line-height:1.5;}

表

/* 表 */
table {
    border-collapse: collapse;
    text-align: center;
    margin: 0px auto;
    line-height: 1;
    font-size:8pt;
    font-family:"IPAex明朝",serif;
}
table thead th {
    padding: 10px;
    font-weight: bold;
    vertical-align: top;
    color: ;
    border-bottom: 1px solid black;
}
table tbody th {
    width: ;
    padding: 10px;
    font-weight: bold;
    vertical-align: top;
    border-bottom: 0px solid black;
    background: ;
}
table td {
    width: ;
    padding: 10px;
    vertical-align: top;
    border-bottom: 0px solid black;
}

画像

/*画像センタリング*/
img.center{
    display:block;
    margin:0 auto 0 auto;
}

/*画像キャプション*/
figure {
    text-align: center;
    margin: 10px auto; /* not needed unless you want centered */
}

figcaption{
    font-size: 9pt;
    margin:5pt 0 0 0;
    padding:0;
    line-height:1em;
}

脚注

/*脚注領域*/
.footnotes {
    page-break-before:always;
    font-family:"IPAex明朝",serif;
    font-size:10pt;}

.footnotes ol {
  list-style-type: decimal;
}

改ページ

/*改ページ*/
.pagebreak{
    page-break-before:always;
    padding-top:0em;
    text-align: justify;
    text-justify: inter-ideograph;
}

非表示

/*レジュメ時の非表示*/
.TextNoDisplay {display:none;}