HTMLとCSSについて

「photoswipe.js」を使って画像を拡大表示させよう ホームページにはクリックで画像を拡大するページがありますよね。 新規でタブが開いて、ブラウザ内に大きく表示されたり、ページが暗転してその上に画像が表示されたり […]

biggerlink.jsでクリックできる領域を拡大させる ホームページを作っていて、a要素でリンクを設定します。その時にa要素で囲んだ範囲しか、リンクができません。 あまり問題が無いように思えますが、実際にWebページ […]

URLが恒久的に変更された事を伝える「301リダイレクト」 301リダイレクトはURLが恒久的に変えた場合に使われる転送処理のステータスコードです。 「ページをリニューアルして、フォルダ構造が変わった」「移転してドメイン […]

クリック（タップ）で展開するコンテンツ ページメニューなどが時々クリックすると中身が展開するコンテンツがありますよね。 スマートフォンページのページメニューはほぼその形です。 少ない表示エリアでも一部を隠しておくことで広 […]

404エラーとは 突然ですが「404エラー」とはなんだかわかりますか？ ホームページを見ていると時々出てくるアレ・・・画面に大きく「Not Found」とか「Webページがありません」と表示されるアレです。 404エラー […]

ページスクロールについてくるコンテンツを作るには ページスクロールについてくるコンテンツについて、前回紹介しました。 では実際にどうやって作り込んでいくのか・・・ 今回は実装方法についてお話していきましょう。 一番簡単な […]

IE8以前をサポートする1.X系、IE9以降をサポートする2.X系 jQueryを使った画像スライダーを入れたり、クリックで画像を拡大させたり・・・ホームページに動きを付けたい時に必須となる「jQuery.js」 1.6 […]

CSSはデザインやレイアウトを統一するために使われる CSSでホームページを装飾するとき、class名を付けてそれぞれ記述していきます。 写真一覧用のCSS、お知らせ表示のCSSといった具合にたくさんのCSSが必要になっ […]

jQueryとJavaScriptは似ているようで別の物 ホームページを作っていくと、JavaScriptとかjQueryとかって聞いたことありませんか？ 実際にHTMLに書いたり、ファイルを扱っていくと違いがよくわから […]

画像をいつでも中央配置にするには ホームページを制作していて、コンテンツへ入る画像の枚数がまちまちになる事はありませんか？ その都度、HTMLを書き換えていますよね？連続して更新出来るときは困りませんが、少しでも間が空く […]

ul要素を使ったスタイリング 新着情報一覧を組むときにどのHTML要素を使うかを考えてみると、リスト状になるのでdl要素かul要素か迷うところですね。 dl要素にすればdt要素で日付を入れ、dd要素へ内容を入れられます。 […]

dl要素を使ったスタイリング dl・dt・dd要素を使ってデザインをする時、tabel要素の様に表組みにしたいと思う事はありませんか？ 私も実際にホームページを作成していると、レスポンシブWEBデザインで作る関係上tab […]

結合子はとても便利 ある要素の子要素を指定する事ができる「結合子」 ホームページを構築する時にかなりの頻度で使う場面がでてきます。 覚えておくとHTMLへのclass・idの指定を減らす事ができ、CSSの記述もシンプルに […]

グラデーションはCSSで作れる グラデーションの付いたボタンや背景など、ホームページにはグラデーションを付けて装飾したい部分がありますよね。 特にボタンはグラデーションをうまく付ける事で盛り上がって見えるので、ボタンらし […]

四隅にRを付けて丸くするデザインは大変？ 普通にHTMLとCSSだけで装飾をしていくと、要素は四角になって角が直角になりますよね。 角ばったデザインが作っているホームページの雰囲気やイメージにピッタリ合うこともありますが […]

字下げして、整った文章を成形する 段落が何文字分か下げることを「インデント」といいます。 文章の先頭に「・」や「①」など、記号があるとき、その段落は全て先頭を1文字分インデントして先頭をそろえたいですよね。 […]

ボックスに影をつけるには ボックスに影を付ける事で少し浮いたような表現をすることができます。 特にリンクボタンに付けると押し込める様に見えたり、他と差別化できるので目立たせることができます。 こういった影の事をドロップシ […]