ホームページ作成 人気記事ランキング(4ページ目)

空白文字の打ち方を解説。ウェブページ内でスペースを連続表示させる方法です。HTML中で半角スペースを連続して打っても、表示される空白は1つ分だけです。しかし「＆nbsp;」などの文字実体参照という特殊な記述方法を使えば、複数の連続した空白も入れられます。しかも、「半角スペースより細い空白」や「半角と全角スペースの中間くらいの空白」など4種類の空白文字があります。

画面サイズ別にCSSをメディアクエリで切り替える方法を解説。メディアクエリとは、画面サイズなどの閲覧環境に応じて適用スタイルを切り替えるCSSの機能です。レスポンシブWebデザインを作る際にも使い、HTMLのmedia属性値やCSSの@media規則で条件を指定します。スマホ専用スタイルや、PC等の広い画面幅向けスタイルなどを作成しておき、簡単に切り替えられます。

画像リストの中からランダムに1つの画像を表示する方法を解説。アクセス者がページを閲覧するたびに画像を切り替えて表示できます。乱数を使ってランダムに画像を表示すると言っても、記述するJavaScriptソースはほんの数行だけなので簡単に作れます。

FTPソフトとは、サーバにファイルをアップロードしたり、サーバにあるファイルをダウンロードしたりする際に使うファイル転送用ソフトウェアのことです。作成したウェブページをインターネット上などに公開する目的にも使います。Windows用の無料FTPソフトとしては、FFFTPやWinSCPがおすすめです。FTPソフトの概要と役割、一般的な使い方を簡単にご紹介。

Webページの周囲にある余白を消す方法や、余白部分にだけ背景色や背景画像を加えるスタイルの書き方、任意の余白サイズを指定する方法などを簡単に解説。Webページ周囲の余白は主に、HTMLのbody要素に対するマージンで作られています。上下左右のマージン量をCSSで調整したり装飾したりすれば、ページ周囲の余白をなくすことも自由な色を付けることも簡単です。

ハート記号（ハートマーク）を書く方法を解説。画像を使わなくても、Unicodeに定義された絵文字を使えば20種類以上のハート記号を簡単にウェブ上に表示できます。CSSを使えばハートの色もサイズも自由に装飾可能。文字実体参照や数値文字参照の書き方を使ってハート記号をウェブページ上に表示する方法などをご紹介。

アルバムのように、キャプション(タイトル名)を加えた画像を横方向にたくさん並べてみましょう。横に並ぶ数を指定せず、ウインドウサイズに応じて自動的に配置される「リキッドレイアウト」で実現する方法をご紹介。

創作用素材としてNHKが無料提供している映像素材集サイト「NHKクリエイティブ・ライブラリー」には、NHKの番組から切り出した動画や音声素材が5,000本ほど公開されており、すべてを無料で利用できます。素材の動画や音声は編集したり他の素材と組み合わせたりでき、加工した動画や音声はウェブ上に公開することもできます。簡単な利用方法をご紹介いたします。

HTMLのaudio要素を使って、Webページ上で音楽を再生したり効果音を鳴らしたりする方法を解説。ブラウザ内蔵の音楽再生コントロール（再生ボタンがあるプレーヤー）を表示させてMP3ファイルなどの音楽を流す方法や、JavaScriptを使って音を鳴らすタイミングを制御する方法を解説。autoplay属性で自動再生させたり、source要素で複数のファイル形式に対応させたりできます。

HTMLに書いた文字をCSSで装飾する際に、1文字ずつ異なる文字色で表示されるよう指定する方法を解説。HTMLの特定の要素内に書かれた文字列を、JavaScript（jQuery）を使って文字単位に分解して個別の要素でマークアップすれば、CSSのnth-child疑似クラスなどを使うことで1文字ずつ個別のスタイルを適用できます。1文字ずつ異なる色でカラフルに表示したい場合に便利。