日別アーカイブ: 2013年6月30日

疑似要素 :before :after の使い方

本日は、デザインにおいて無限の可能性(大げさ?)を秘めた疑似要素 :before, :after を使ってみよう!の巻です。

疑似要素 :before, :after とは?

htmlに手を加えずに、要素の前(:before)と後ろ(:after)にフェイク(疑似)の要素を追加出来るというものです。
これを極めますと、画像を一切使用せず疑似要素だけで作られたアイコンなど、かなり凄い事が出来るようです。

今回はbodyタグに:before, :afterの擬似要素を使い、ヘッダーとフッター部分に色をのせて境界線を作ってみます。
このサイトのヘッダーとフッター部分の薄いグレーの色の部分です。
ちなみにヘッダー部分を:before、フッター部分を:afterで指定しています。
続きを読む

2013-6-28 勉強会

今日もランサーしょうじさんとsa-kaさんはお休みです。。。 ガーΣ(`・ω・Ⅲ)ーン
みんなで待ってますよー!!!ヽ(*゜∀゜*)ノ
勉強会の概要は

  • 真中さんの質問。”phpでお問い合わせフォームを作る”
  • kanedaさんの質問。”table-cellはmarginが無効。でも隙間を作る方法”
  • パソコン倶楽部りんごと、サイト設計について

html5で作るWPオリジナルテーマ:3は時間がなくなったので次回以降に持ち越し。 続きを読む