WEB DESIGN

CSS

Bootstrapの基本的な使い方

唐突ですが、皆さんは「Bootstrap」を利用していますか? 「何となく聞いたことがあるけれど結局何のことなの?」 「ちょっと使ってみたかったんだよね~。」そんな方に向けて「Bootstarap」を...
HTML

相対パスと絶対パスの記述おさらい!

階層が違うファイルを指定する時は、どう記述すればいいんだっけ?「CSS」で画像を指定したい時の相対パスは?そんな基本的な、「相対パス」や「絶対パス」について、ちょっと確認しておこうかなって人へ。// ...
WordPress

Facebookコメントを投稿ページごとに設置する方法

WordPressサイト内でそれぞれの投稿記事内に、Facebookからのコメントを受け付けたい場合Facebookのプラグインの「Comments」からソースコードを生成し、そのまま貼り付ければ設置...
WordPress

トップに表示するページを変更したいとき

久々にWordPressネタです。// // サイトのトップページは通常、「index.php」を読み込んで表示させていますが、管理画面の「表示設定」である特定の「固定ページ」を表示させることも出来ま...
CSS

z-indexがイマイチよくわからない!?

今回は「z-index」にフォーカス!なんやかんや「z-indexがイマイチよくわからない!?」って人向けです。簡単に言ってしまえば、z-indexプロパティは、要素の重なりの順序を指定することができ...
jQuery

レスポンシブ対応のフォトギャラリー「least.js」

スマートフォンなど、様々なデバイス幅に対応したフォトギャラリーを、またひとつご紹介致します。今回は、ポップアップではなくダウンスライドでページの先頭に「写真とテキスト」を表示させることが出来るものにな...
CSS

デバイス幅に合わせたメニューボタンを、どうしてもサイズ可変の背景画像で作成したいとき。

スマートフォンサイトなどをコーディングする際に、トップページにサブ的なナビゲーションや各コンテンツへのリンクを目立つような画像で配置したい!などの要望があるかと思います。そんな時に、デバイス幅に合わせ...
CSS

W3Cの勧告ステータスまとめ!

様々なWeb標準企画が、W3C勧告に至るまでのプロセスをまとめてみました。こむずかしい内容ですが、ニュアンス程度にも理解しておくといいかもしれません。サラっと流す程度にどうぞ。// // W3C(Wo...
CSS

3D効果を利用したCSSアニメーションでフォトギャラリー

CSS3の3D効果を使って動きのあるフォトギャラリーを作ってみたいと思います。現状ChromeやSafariなどのwebkit系ブラウザでのみの対応なのでなかなか実装できるシーンは少ないかもしれません...
JavaScript

JavaScriptを基礎から!条件分岐について…

今回は、JavaScriptを基礎からの続きで「条件分岐」について見ていきたいと思います。条件分岐とは、Aである場合A+する。または、Bである場合はB+する。そのどちらでもなければC+する。などのよう...
CSS

要素を上下左右でセンタリングする方法

要素をページの中央に配置したい場合は、「margin:0 auto;」 で対応できますが、縦方向の中央配置に関しては「vertical:middle; 」では対応してくれません。そこで、上下左右ともに...
WordPress

アイキャッチ画像登録の時間短縮に使える「Drag & Drop Featured Image」プラグイン

WordPressにおいて毎度の作業である「アイキャッチ画像」の登録ですが、通常は画像をメディア内に「アップロード」→「選択」→アイキャッチ画像として「登録」していると思いますが、この毎回のちょっとし...
HTML

検索エンジンの巡回クロールを回避する方法

サイトの運営をしていく中で、サイトが公開前の準備段階である場合や管理画面URLなど、検索エンジンにクロールされては困る状況があると思いますが、そういった時はHTMLの「metaタグ」による設定方法や「...
CSS

background-blend-modeプロパティによるCSSグラデーションの可能性が今後広がるかも…

背景パターンを作成する際、今まではIllustratorやPhotoshopを用いて背景となるパターン画像を作成し、backgroundとしてリピートさせていましたが、CSS3の新たなプロパティである...