はじめに
Qiita で記事を書く皆さん,文字を強調したいとき
- 太字にする
- 斜体にする
- カラーにする
などの手段を取っていると思われますが,文字の大きさを変えることは難しいでしょう。Qiita では HTML タグである <font size=*>
やスタイルシート指定 style="font-size:*"
が使えないからです。
HTML タグを用いた場合
HTML タグを用いた場合
HTML タグを用いた場合
HTML タグを用いた場合
HTML タグを用いた場合
HTML タグを用いた場合
markdown の基本文法である見出し記号 #
もしくは <h1>
~ <h6>
までのタグを用いると文字列の強調(大きさ,太字)は可能ですが,残念ながら見出しになってしまうのです。たとえば上記の文字列は見出しになっていることが分かります。<h1>
~ <h2>
までは下線も引かれます。
<h1><font color=red>HTML タグを用いた場合</font></h1>
<h2><font color=red>HTML タグを用いた場合</font></h2>
<h3><font color=red>HTML タグを用いた場合</font></h3>
<h4><font color=red>HTML タグを用いた場合</font></h4>
<h5><font color=red>HTML タグを用いた場合</font></h5>
<h6><font color=red>HTML タグを用いた場合</font></h6>
MathJax を用いた場合
MathJax を用いる方法があります。筆者の確認したところ以下の5段階で大きさを設定できるようです。
$\color{red}{\huge \textsf{MathJax を用いた場合}}$
$\color{red}{\large \textsf{MathJax を用いた場合}}$
$\color{red}{ \textsf{MathJax を用いた場合}}$
$\color{red}{\small \textsf{MathJax を用いた場合}}$
$\color{red}{\tiny \textsf{MathJax を用いた場合}}$
$\color{red}{\huge \textsf{MathJax を用いた場合}}$
$\color{red}{\large \textsf{MathJax を用いた場合}}$
$\color{red}{ \textsf{MathJax を用いた場合}}$
$\color{red}{\small \textsf{MathJax を用いた場合}}$
$\color{red}{\tiny \textsf{MathJax を用いた場合}}$
MathJax は字体(フォント)も変えることができます。
$\color{red}{\textsf{MathJax を用いた場合}}$
$\color{red}{\textrm{MathJax を用いた場合}}$
$\color{red}{\textbf{MathJax を用いた場合}}$
$\color{red}{\texttt{MathJax を用いた場合}}$
$\color{red}{\textsf{MathJax を用いた場合}}$
$\color{red}{\textrm{MathJax を用いた場合}}$
$\color{red}{\textbf{MathJax を用いた場合}}$
$\color{red}{\texttt{MathJax を用いた場合}}$
PlantUML を用いた場合
PlantUML を用いる方法もあります。コチラは文字の大きさやフォントなど自由に設定できます。ただし,画像として貼り付けられているため,テキストをコピー&ペーストできないうえ,周囲にはグレーのボーダーラインが入ってしまっているのが残念なところです。
```plantuml
<style>
root {
padding 0
margin 0
}
title {
horizontalAlignment left
fontStyle normal
fontColor red
}
</style>
title
<size:48>PlantUML を用いた場合</size>
<size:36>PlantUML を用いた場合</size>
<size:24>PlantUML を用いた場合</size>
<size:18>PlantUML を用いた場合</size>
<size:12>PlantUML を用いた場合</size>
end title
```
Mermaid を用いた場合
Qiita でサポートしている二大作図言語のもう一つ Mermaid を使う方法です。コチラは図の周囲に不自然なボーダーラインが入らないですし,テキストのコピー&ペーストも可能です。ただし,余白の大きさを変更できないうえ,タイトル文字列の大きさも変えられないのが残念なところです。※変更方法がまだ見つかっていません。
```mermaid
---
title: Mermaid を用いた場合
---
%%{init{'themeVariables':{'textColor': 'red'}}}%%
graph LR
```
まとめ
本件に対しては引き続き調査中です。進展があり次第,報告したいと思います。