noteで使えるHTMLタグ一覧とサンプル

100円ください^^
2014/04/24現在、
a,b,blockquote,br,h3,img,p,pre 以上のHTML要素が使用可能となっている。
style属性もテキストの装飾程度ならそこそこ使えるようだ。

ただしタグはペーストした場合にのみ反映される。
どういうことかというと、
<b>太字</b>
テキストエディタ等で括弧を半角に修正してから、上の行をnoteの投稿欄にペーストすると、「太字」の部分がちゃんとboldで表示される。

注意:非公式の方法なので自己責任で。

注意:工夫すればスマホからの投稿時にもp段落ではなくbrで改行できたり、リンクテキストの処理などはけっこう楽になると思うが、その程度しか役に立たない。

注意:noteのエディタ画面から再編集をするとpreやblockquoteの囲みがズレることがある。テキストエディタで書いたものをペーストする、そしてテキストファイルにバックアップをとっておく使い方をする人向け。

一部の記号は編集中に問題が生じるため全角で記した。

■HTML要素一覧


■目次

■a リンク
■b 太字(ボールド)
■blockquote 引用
■br 改行
■h3 見出し
■img 画像を表示
■p 段落
■pre 整形ずみテキスト

----------------------------------------

■a リンク


アンカーは使えない。

<a href="http://www.google.co.jp/ ">リンク</a>

表示例:リンク

■b 太字(ボールド)


<b>太字</b>

表示例:太字

■blockquote 引用


<blockquote>引用</blockquote>

表示例:

引用

----------------------------------------
表示例:

引用1
引用2
引用3


タグ内の改行も普通に表示されている。

■br 改行


重要なポイントは、エディタ上で改行せずにbrタグをつなげること。そうしないと改行が二重になってしまうぞ。

改行<br>改行<br>改行<br>

表示例:
改行
改行
改行

----------------------------------------
<p>改行<br>改行<br>改行<br></p>

表示例:

改行
改行
改行


----------------------------------------
改行<br>
改行<br>
改行<br>

表示例:
改行

改行

改行

■h3 見出し


<h3>見出し</h3>

表示例:

見出し


■img 画像を表示


表示例としてnoteのデフォルトアイコンおよびGoogle社のロゴへのリンクを使用する。
https://note.mu/images/default/default_profile.png
https://www.google.co.jp/images/srpr/logo11w.png

<img src="https://www.google.co.jp/images/srpr/logo11w.png">

なお、alt や height, width などの属性は削除される。

表示例:


<img src="/images/default/default_profile.png">

相対パスもいける。

表示例:

■p 段落


<p>段落</p>

表示例:

段落


■pre 整形ずみテキスト


<pre>整形ずみテキスト1
整形ずみテキスト2
整形ずみテキスト3</pre>

整形ずみテキスト1
整形ずみテキスト2
整形ずみテキスト3


----------------------------------------
以下、使えないもの。

hr 水平の罫線
h1,h2,h4,h5,h6 h3以外の見出し
u 下線
ul, ol リスト
i 斜体

----------------------------------------

ここから先は

64字

¥ 100