矢印を表示する HTML コード

Naila Saad Siddiqui 2023年6月20日

HTML HTML Unicode HTML Symbol

この記事では、Unicode 文字エンティティを使用して HTML ページにさまざまな文字を表示する方法について説明します。 HTML では多数のエンティティが使用されますが、ここでは上下左右の三角形の矢印の学習に焦点を当てます。

例を含む HTML エンティティ

HTML では、いくつかの文字が予約されています。これは、テキスト内でタグを使用すると、ブラウザーがタグをより小さい (<) またはより大きい (>) 記号と混同する可能性があるためです。 HTML では、予約文字は文字エンティティを使用して表示されます。

文字エンティティは次のように表示されます。

&name_of_entity

また

&#number_of_entity

これは、HTML 文字エンティティが常にアンパサンド (&) 記号またはアンパサンドハッシュ (&#) 記号で始まることを意味します。たとえば、頻繁に使用される HTML エンティティの 1つは &nbsp です。これは、任意の 2つの単語の間の区切りのないスペースです。

エンティティには名前と番号もあります。たとえば、改行なしスペースのエンティティ名は &nbsp で、エンティティ番号は &#160 です。どちらも同じ意味と目的を持っています。

HTML では多数のエンティティが使用されますが、上下左右の三角形の矢印について説明します。以下の例を見てみましょう。

<html>
    <body>
        <h1>HTML Triangular Arrow Entities</h1>
        <h2>The upper arrow is displayed as: &#9650;</h2>
    </body>
</html>

同様に、下向きの三角形の矢印を表示する必要がある場合、コードは次のようになります。

<html>
    <body>
        <h1>HTML Triangular Arrow Entities</h1>
        <h2>The down arrow is displayed as: &#9660;</h2>
    </body>
</html>

右向きの三角形の矢印を表示するには、次のコードを使用できます。

<html>
    <body>
        <h1>HTML Triangular Arrow Entities</h1>
        <h2>The right arrow is displayed as: &#9654;</h2>
    </body>
</html>

また、右向きの矢印は、次のエンティティ番号を使用して表示されます。

<html>
    <body>
        <h1>HTML Triangular Arrow Entities</h1>
        <h2>The left arrow is displayed as: &#9664;</h2>
    </body>
</html>

上記のすべての HTML コードスニペットでは、10 進数を使用して HTML エンティティを示していることに注意してください。ただし、これらのシンボルは、対応する 16 進コードを使用して表示することもできます。

以下の表は、対応する 16 進数を示しています。

これらは三角形のそのような変形の 1つであることを覚えておく必要があります。他にもさまざまな色とさまざまなサイズのものがたくさんあります。それぞれに異なる 10 進数と 16 進数のコードがあります。