テキストの装飾の指定： CSSとLaTeXの比較

>   これは「[TeX/LaTeX Advent Caleandar 2013](http://www.adventar.org/calendars/187)」の 19 日目の記事です。
>   （18 日目は [k16shikano さん](http://note.golden-lucky.net/2013/12/colortbl-cline.html) （2回目）です。）
>   （20 日目は [k16shikano さん](http://note.golden-lucky.net/2013/12/learn-you-tex-for-great-good-3.html) （3回目）です。）

「HTML と LaTeX の比較」は何度か見たことがあるが、CSS との比較は見かけないので作ってみた。

| CSS | LaTeX | 適用例 | 備考 |
|:----|:------|:------:|:-----|
| **font-style プロパティ** | **（フォントシェープ指定）** | | ※1 |
|`italic`   (イタリック体)  | `\textit{...}` or `{\itshape ...}`   | ![cssvs01.png](https://qiita-image-store.s3.amazonaws.com/0/14550/7ee3ade5-fb50-fad8-99c9-1746a139e6ae.png) | |
|`oblique` (斜体)           | `\textsl{...}` or `{\slshape ...}`   | ![cssvs02.png](https://qiita-image-store.s3.amazonaws.com/0/14550/e4b686c7-7a8e-7356-f25b-6bdeee3b90da.png) | |
|`normal`  (直立体)         | `\textup{...}` or `{\upshape ...}`   | ![cssvs03.png](https://qiita-image-store.s3.amazonaws.com/0/14550/517dd9a0-a0ec-f99d-f736-89ebd35508ec.png) | ※1 |
| **font-variant プロパティ** | **（フォントシェープ指定）** | | ※1 |
|`small-caps` (スモールキャプス)   | `\textsc{...}` or `{\scshape ...}`   | ![cssvs04.png](https://qiita-image-store.s3.amazonaws.com/0/14550/b5b23b9c-1ab0-879c-ebb3-349c909ea011.png) | |
| **font-weight プロパティ** | **（フォントシリーズ指定）** | | |
|`bold`   (太字)            | `\textbf{...}` or `{\bfseries ...}`  | ![cssvs05.png](https://qiita-image-store.s3.amazonaws.com/0/14550/b8f5cd54-9db8-20cc-681b-6d9f9c6be59b.png) | |
|`normal` (通常)            | `\textmd{...}` or `{\mdseries ...}`  | ![cssvs06.png](https://qiita-image-store.s3.amazonaws.com/0/14550/1ec30a2d-ee11-5bc4-d18f-59c7969d2f55.png) | |
| **font-size プロパティ** | **（フォントサイズ指定）** | | |
|`x-large`  (極大)          | `{\Large ...}`                       | ![cssvs07.png](https://qiita-image-store.s3.amazonaws.com/0/14550/2caa7ffe-7f1d-3fdf-3aae-bc499f8a8cf1.png) | |
|`large`    (大)            | `{\large ...}`                       | ![cssvs08.png](https://qiita-image-store.s3.amazonaws.com/0/14550/2616a758-97d4-74eb-802e-6b670c1eaad5.png) | |
|`medium`   (通常)          | `{\normalsize ...}`                  | ![cssvs09.png](https://qiita-image-store.s3.amazonaws.com/0/14550/dd379c37-b2c1-ed41-af71-e7b09af0406e.png) | |
|`small`    (小)            | `{\small ...}`                       | ![cssvs10.png](https://qiita-image-store.s3.amazonaws.com/0/14550/c373fa0f-679f-e783-ce56-c610e105092f.png) | |
|`x-small`  (極小)          | `{\footnotesize ...}`                | ![cssvs11.png](https://qiita-image-store.s3.amazonaws.com/0/14550/b9901bf0-c606-4372-9601-a51d14b721f7.png) | |
|`15pt`  (寸法指定)         | `{\fontsize{15}{15}\selectfont ...}` | ![cssvs23.png](https://qiita-image-store.s3.amazonaws.com/0/14550/9575aadc-be04-35cd-018d-0940b52a69fd.png) | ※2 |
| **font-family プロパティ** | **（フォントファミリ指定）** | | |
|`serif`       (セリフ)     | `\textrm{...}` or `{\rmfamily ...}`  | ![cssvs12.png](https://qiita-image-store.s3.amazonaws.com/0/14550/24d9c19b-1199-7853-d9c0-f53e45e35b40.png) | ※3 |
|`sans-serif`  (サンセリフ) | `\textsf{...}` or `{\sffamily ...}`  | ![cssvs13.png](https://qiita-image-store.s3.amazonaws.com/0/14550/4748ea26-8888-76e0-14f0-3a8005859d6f.png) | ※3 |
|`monospace`   (等幅)       | `\texttt{...}` or `{\ttfamily ...}`  | ![cssvs14.png](https://qiita-image-store.s3.amazonaws.com/0/14550/0e06928c-bb7c-95ee-a154-80b3e3a0f9b0.png) | ※3 |
|`'Times'`                  | `{\fontfamily{ptm}\selectfont ...}`  | ![cssvs15.png](https://qiita-image-store.s3.amazonaws.com/0/14550/b47872e0-520f-e0f9-b867-84f48c0b6f33.png) | ※4 |
|`'Helvetica'`              | `{\fontfamily{phv}\selectfont ...}`  | ![cssvs16.png](https://qiita-image-store.s3.amazonaws.com/0/14550/817f684a-fc11-00ad-4066-9749fe1c3a6e.png) | ※4 |
| **color プロパティ** | **（要** [color](http://www.ctan.org/pkg/color) **パッケージ）** | | |
|`red`           (名前指定) | `{\color{red}...}`                   | ![cssvs17.png](https://qiita-image-store.s3.amazonaws.com/0/14550/6cd4800c-a79d-e6e9-f3ad-861bbbddeb46.png) | ※5 |
|`rgb(0%,40%,20%)` (値指定) | `{\color[rgb]{0,0.4,0.2}...}`        | ![cssvs18.png](https://qiita-image-store.s3.amazonaws.com/0/14550/3d068497-eca1-2a0e-af0c-c310a8cfd184.png) | ※6 |
| **text-decoration プロパティ** | | | |
|`underline`    (下線)      | `\uline{...}` （要 [ulem](http://www.ctan.org/pkg/ulem)） | ![cssvs19.png](https://qiita-image-store.s3.amazonaws.com/0/14550/39ce53c5-9a14-5c7f-3503-b36405308e0f.png) | ※7 |
|`overline`     (上線)      | `\Overline{...}`  （要 [umoline](http://www.ctan.org/pkg/umoline)） | ![cssvs20.png](https://qiita-image-store.s3.amazonaws.com/0/14550/67b40a85-2cac-17b5-7c66-348427b6df80.png) | |
|`line-through` (取消線)    | `\sout{...}` （要 [ulem](http://www.ctan.org/pkg/ulem)） | ![cssvs21.png](https://qiita-image-store.s3.amazonaws.com/0/14550/c0a2b921-fdcb-fcf9-c649-5db1abf651c8.png) | ※7 |
|`blink`        (点滅)      | `\textblink{...}` （要 [bxblink](https://gist.github.com/zr-tex8r/8040061)） | ![cssvs22.gif](https://qiita-image-store.s3.amazonaws.com/0/14550/add202d4-a12d-447c-d7ac-9d84f6c848d0.gif) | ※8 |

**注釈**

※1 font-shape と font-variant は CSS では別の区分となるが、LaTeX では同じ区分（シェープ）に属する。
だから、LaTeX で `{\scshape\slshape Text}` としても通常は「スモールキャプスの斜体」ではなく（`\slshape` が `\scshape` を打ち消して）「単なる斜体」になってしまう。
同様に、`\upshape` は斜体やイタリックだけでなくスモールキャプスも打ち消す。
※2 `\fontsize` の第 2引数は行送りの長さ（CSS では line-height プロパティ）を表す。
※3 これらの“総称”のファミリの実体は既定では Computer Modern フォントであるが、この設定は文書ごとに変更できる。
※4 LaTeX ではフォントファミリに英字からなる短い識別子を付けて管理していて、例えば、Times → `ptm`、Helvetica → `phv`、Palatino → `ppl`、Computer Modern Roman → `cmr`。
※5 既定で利用できる色名は black, white, red, green, blue, cyan, magenta, yellow。
※6 `\definecolor{mygreen}{rgb}{0,0.4,0.2}` と色名を定義してそれを使うのが通例。
なお、印刷物ではCMYKモデルの使用が望ましい。
※7 umoline パッケージにも下線（`\Underline`）と取消線（`\Midline`）の機能があるが、ulem パッケージの方が有名。
※8 PDF 出力でのみ利用可能。残念ながら紙に印刷した場合は機能しない。

[極めてどうでもよい補足](http://qiita.com/zr_tex8r/items/6122e24878993cf59a9f)