![http://www.hp-stylelink.com/news/2013/07/20130716.php](https://cdn-ak-scissors.b.st-hatena.com/image/square/81793d08bba76d476651c4247010b8634592d564/height=288;version=1;width=512/http%3A%2F%2Fwww.hp-stylelink.com%2Fnews%2Fassets_c%2F2013%2F07%2F20130716_thumbnail-thumb-200x160-7.jpg)
2007年のiPhone発売以来、スマートフォンにおける画像の表示サイズは、 最大幅320pxとされてきましたが、 2010年に発売されたiPhone4のRetinaディスプレイ対応によって、 それまで320pxの画像を実寸で表示していたものから 「640pxの画像を320px幅で表示する」という方法が主流になり、 さらにその後のAndroidのディスプレイの高精細化によって、 「ディスプレイのサイズに合わせて画像を幅100%でFixさせる」 と、変遷してきました。 それに伴い、背景画像も「ディスプレイのサイズに合わせて幅100%でFixさせる」 という表示方法が多く使われるようになり、 background-sizeプロパティをよく使うようになったので、覚書としてまとめました。 サンプルでは、300px×200pxの表示領域に、100px×100pxの画像を背景として表示しています。 ■
Mobile Safari等 background-attachment:fixed; が効かない環境でもそれらしいことをやりたい場合の方法として、position:fixed; の全面div要素を背面に敷いておく方法がよく紹介されていました。 少し改良?しつつメモ。 サンプル http://jsrun.it/volkuwabara/w5KY (スマホからどうぞ) ソース body::before { background:url('bg.png') no-repeat left top; background-size: 100% auto; display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; padding-bottom: 108px; content: ""; z-index: -1
こんにちは、霙(@xxmiz0rexx)です。 WordPressでサイトを作っている時、ページナビや関連記事の機能などはプラグインを使用して実装することも多いと思います。 そのプラグインの見た目なんですが、私の場合、デフォで設定されているCSSじゃなく自分でCSSを書きたい時がほとんど。 自分で書く場合もともとのCSSは邪魔なので、それをfunctions.phpから削除する方法をメモします。 まずは作っているサイトを開き、ソースを見てみましょう。 プラグイン名が入ったlink要素がいくつかあると思います。 その中で、スタイルを上書きしたいもののIDをメモしておきましょう。 仮にプラグイン『Search Everything』だとしたら <link rel="stylesheet" id="se-link-styles-css" href="http://hoge.com/wp-cont
Modern.ieの利点 Modern.ieを使えば仮想マシン上でWindowsとIEを動かすことができます。 1月に入ってサイトがリニューアルされ、ダウンロード方法が変わったのでメモしておきます。 事前準備 インストールする前にVirtualBoxをインストールしておきます。 仮想マシンのダウンロード 以下のURL(modern.ieのダウンロードページ)にアクセスします。 https://www.modern.ie/ja-jp/virtualization-tools#downloads 次に、ダウンロードするマシン、プラットフォームを選択し"Download Zip Archive"を選択します。 かなりダウンロードに時間がかかるので気長に待ちます。 仮想マシンのインストール ダウンロードされたZipファイルをダブルクリックして解凍します。 展開すれば画像のようなOVAファイルができ
WordPressでテンプレート毎にヘッダを変えて表示したい場合があると思います。 今回は複数のヘッダを用意しておいて、テンプレート毎に切り替えて利用する方法を紹介します。 ヘッダの表示はget_header関数 WordPressでヘッダを表示するために呼ばれているのはget_header関数です。 get_header関数は引数の有無で表示するヘッダを変更することができる仕組みになっています。引数を指定すると、指定した引数名と一致するヘッダを読みこませることができます。 // 引数が何もない状態で実行すると、header.phpを表示 <?php get_header(); ?> // ダブルクオーテーションで区切ると、header-2013.phpを表示 <?php get_header("2013"); ?> 仕組みはフッタも同じ フッタの場合もヘッダと同様に複数のフッタから表示す
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く