ホームページ作成
特殊文字・記号の記述 (HTML)
HTMLでの特殊文字・記号の記述についてまとめました。
記事一覧
使うアイコンだけを含む最小限のウェブフォントを作る
ガイド記事西村 文宏ウェブページ上に表示するアイコンは、画像よりもウェブフォントが便利ウェブフォントなら、拡大・縮小が綺麗で、表示色・背景色も自由自在ウェブ上に、アイコンのような小さな絵を表示したい場合、画像で用意するよりも、「ウェブフォント」を利用する方が便利です。色や大きさが固定されている画像とは異なり、フォントな...続きを読む
「♪」以外の音符記号を表示させたい!
ガイド記事西村 文宏div.sourcecode{background-color:#eeeeee;padding:4px4px4px20px;margin:12px;line-height:1.4;font-family:monospace;}div.samplearea{padding:4px4px4px20px;...続きを読む
100種類以上ある! ウェブ上で使える矢印記号(絵文字)
ガイド記事西村 文宏ウェブ上で表示可能な矢印記号には「↑←↓→」以外にも多数ある矢印記号というと「↑」「←」「↓」「→」の4つがよく使われています。「やじるし」と入力して漢字変換すれば出せる環境が多いので、簡単に入力できる矢印の代表格でしょう。しかし、ウェブ上に書ける矢印記号(矢印の絵文字)はもっとたくさんあり、実は1...続きを読む
空白文字の打ち方!HTMLで使えるスペースの入れ方いろいろ
ガイド記事西村 文宏空白文字の打ち方!HTMLで使えるスペースの入れ方HTMLでスペースを入れるには?ウェブページ上に、複数のスペース(空白文字)を連続して掲載したい場合があります。ワープロソフトならスペースキーで必要なだけ空白文字を入れれば良いのですが、ウェブ上ではその方法では望み通りにいかない場合があります。なぜな...続きを読む
スペード、クラブ、ダイヤも表示したい!
ガイド記事西村 文宏span.samplespades{color:#aa00aa;}span.sampleclubs{color:#008000;}span.samplediams{color:#999900;}span.samplehearts{color:#ff2525;}h3span{font-size:200...続きを読む
ハートマークの出し方!ハート記号を表示したい
ガイド記事西村 文宏HTMLでもハートマークは簡単に表示できます!♥♥♥♥♥♥♥♥様々な記号の中でもハートマークは需要の高い記号でしょう。昔はウェブ上でハートマークを表示するには、画像として作ったり特殊なフォントを指定したり面倒な手間が必要でした。しかし現在ではUnicodeの中に絵文字としてハート記号も含まれているた...続きを読む
2乗や3乗などのn乗をHTMLで表示する方法
ガイド記事西村 文宏平方メートル(m²)や立方メートル(m³)のような2乗・3乗を表示したいn乗(指数)をHTMLで表示したいウェブ上で何らかの数値を記述する際、単位も併せて表示したいことがよくあります。距離なら「256m」や「120m」などのように英字のm(エム)を使えば良いだけなので問題ありませんが、面積を表す際の...続きを読む
丸囲み数字などの環境依存文字を使う方法
ガイド記事西村 文宏環境依存文字(機種依存文字)とは?文字化けしない表示方法とは?丸囲み数字、ローマ数字、ハートマークなど一部の文字や記号は、環境依存文字(機種依存文字)と呼ばれます。Webページやメールなどの各種文書を作成する際の文字コードにUTF-8などのUnicode(ユニコード)を採用していれば、それらの環境依...続きを読む
画像を使わずに絵や記号を表示?特殊なフォントを使う
ガイド記事西村 文宏画像を使わずに絵や記号を表示?まずは、下記のウインドウイメージをご覧下さい。様々な絵や記号が表示されています。しかし、これらのウインドウ内には、全く画像ファイルは使われていません。画像ファイルを使わなくても、これらの絵や記号を表示させることができるのです。どうやっているのでしょうか?ページの読み込み...続きを読む