WEB DESIGN

HTML

特定ページやサイト全体のURLを変更した際のリダイレクト設定

Webサイト内のページURLの変更や削除、またはディレクトリごとの移動やサイト全体の移転などを行う場合、リダイレクト(転送)という処理で新たなページに遷移させることがありますが、正しい知識と手順で行わ...
CSS

CSSで描画表現を指定できるブレンドモード

PhotoShopなどに搭載されている機能のひとつである「描画モード」ですが、多くの方がこの機能を利用しているのではないでしょうか。その便利な「描画モード」がCSSで表現できるようになりました。CSS...
JavaScript

JavaScriptを基礎から!変数について…

今回は、JavaScriptを基礎からの続きで「変数」について見ていきたいと思います。// // 変数とは・・・簡単に言うと「データ入れておく箱」と思ってください。変数を使う場合は、まず名前をつけて宣...
JavaScript

JavaScriptを基礎から!

ここまで、jQueryなどJavaScriptに関する記事もいくつか書かせて頂いてきましたが、今一度JavaScriptのおさらいということで基礎からまとめていきたいと思います。今さら基礎なんて必要な...
CSS

CSSの優先度について…

CSSでは、ある特定の要素のセレクタに複数のスタイル指定ができますが、同じセレクタに別々の指定がされた場合は「個別性」の高いスタイルが優先して適用されます。 (adsbygoogle = window...
CSS

CSSで長い文章を段組みで見せるcolumnプロパティの使い方

文書を読んでもらいたいマガジン系のサイトなどで、長文を1ページ内で表示したい場合、いくつかのボックスに分けて段組みレイアウトにするなどして、視覚的に読みやすい配慮が必要になってきます。その際に、複数の...
CSS

cssにおけるidやclassを命名するとき気を付けること…

Webサイト構築の際、それぞれの要素にidやclass名を付けて作成していきますが、汎用性の高いid名やclass名を要素ごとにわかりやすくリスト化しておくと毎度名前を考えたり煩雑にならずに構築してい...
CSS

marginの相殺について…

ある決まった条件において、隣接する要素同士の垂直方向のmarginが結合されてしまうことを「marginの相殺」と呼ばれています。どのような状況において相殺されてしまうのかを確認しておきましょう。 通...
CSS

CSSのみで星の輝く夜空を背景にする方法

サイトの背景を星の輝く夜空のようなイメージにしたい場合、今までは星が点滅するようなGIF画像などを背景に繰り返し配置などをして表現することがありましたが、より自然な星空を css のみで表現可能になり...
HTML

コンディショナルコメントの指定方法について…

IEのブラウザチェックで古いバージョンに対し条件付きのコメントに用いる「コンディショナルコメント」というものがあります。これは「特定のバージョンのIEに対し○○を適用する」という指定の際に利用します。...
CSS

リストやテーブルなどで擬似クラス:nth-child(n)を使って一定の規則に従い背景色などを変える

リストやテーブルのセルの可視性を良くするために、li,tr,th,tdなどの背景色を交互に変える手法がありますが、CSSの擬似クラスである「:nth-child(n)」を利用してそれを実現することがで...
CSS

検索フォームをCSSでカスタマイズする

サイト内検索フォームなどを実装する際に、画像ボタンを配置したり、アイコンを添えてシンプルに見せたりとCSSでちょっとしたデザイン変更をする方法をメモしておきます。検索フォームは、「テキストを入力し送信...
CSS

ol,liなどの番号やマークの下までborderを表示したいとき…

ol,liタグで並べたリストに対し、区切り線を入れたいときに通常の指定では、リストマークの後ろから最後までのをリスト内容と認識し、左端がズレて区切り線が表示されてしまいます。こういった場合に、リストの...
CSS

IE8以下でメディアクエリが効かないとき…

レスポンシブデザインを制作する際に「Media Queries(メディアクエリ)」を使用してCSSの表示を切り替えますが、IE8以下ではこの「Media Queries」に標準対応していません。そこで...