ホームページ作成

HTML5のaudio要素で効果音を鳴らす [ホームページ作成]

2011年9月25日 - ホームページ作成

HTML5のaudio要素を使えば、Flashなどのプラグインがなくてもブラウザの機能だけで音楽データを再生できます。audio要素の用途は音楽プレーヤーの表示だけではありません。プレーヤーを表示せず、スクリプトを使って鳴らすこともできます。おみくじ機能を例に、audio要素で用意した効果音をスクリプ...

Cookieより扱いが簡単な「Web Storage」の使い方 [ホームページ作成]

2011年9月21日 - ホームページ作成

これまで、ウェブページ側からブラウザに対して何らかのデータを保存させるには、Cookie(クッキー)を使うしかありませんでした。しかし、クッキーの読み書きには少々面倒なスクリプトを書く必要がありました。しかし、「Web Storage(ウェブストレージ)」機能なら、もっと簡単な方法でデータの読み書きが...

文字に影を付け、画像に重ねた文字を見やすくするCSS3 [ホームページ作成]

2011年8月29日 - ホームページ作成

写真の上に文字を重ねると、文字が読みにくくなることがあります。しかし、影を付けたり縁取りしたりすれば、読みにくくなるのを防げます。CSS3の「text-shadow」プロパティを使えば、文字に影を付けられます。この影の設定を駆使して「縁取り」効果を作り、写真に重ねた文字を読みやすくする方法をご紹介。 ...

CSS3で偶数行・奇数行など「n番目」を限定装飾する [ホームページ作成]

2011年8月25日 - ホームページ作成

リストやテーブルなど、たくさんの項目が連続する要素は、1行おきに装飾を変えると見やすくなります。CSS3で用意された「nth-child疑似クラス」を使えば、装飾対象を「偶数番目のみ」・「奇数番目のみ」などに簡単に限定できます。他にも「3つおき」や「先頭の5つ」など柔軟に指定できる便利なCSSです。 ...