Skip to content

Instantly share code, notes, and snippets.

@Takazudo

Takazudo/page.html

Forked from tacamy/devicePixelRatio=1_1.5
Created March 11, 2011 08:23
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Takazudo/865619 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Takazudo/865619 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. Takazudo revised this gist Mar 11, 2011. 1 changed file with 4 additions and 0 deletions.
    4 changes: 4 additions & 0 deletions page.html
    View file
    Original file line number Diff line number Diff line change
    @@ -1 +1,5 @@
    <!--
    see http://www.modernizr.com/docs/#backgroundsize
    -->

    <script src="modernizr-1.7.min.js"></script>
  2. Takazudo revised this gist Mar 11, 2011. 2 changed files with 4 additions and 1 deletion.
    1 change: 1 addition & 0 deletions page.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1 @@
    <script src="modernizr-1.7.min.js"></script>
    4 changes: 3 additions & 1 deletion style.css
    View file
    Original file line number Diff line number Diff line change
    @@ -8,9 +8,11 @@
    /* devicePixelRatio=1.5以上 */
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    .className {
    .backgroundsize .className {
    background: url(test@2x.png); /* 2倍の画像 */
    -webkit-background-size: 100px 100px; /* WebKit */
    -moz-background-size: 100px 100px; /* moz */
    -o-background-size: 100px 100px; /* opera */
    background-size: 100px 100px; /* WebKit以外 */
    }
    }
  3. Takazudo revised this gist Mar 11, 2011. 1 changed file with 16 additions and 0 deletions.
    16 changes: 16 additions & 0 deletions style.css
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    /* devicePixelRatio=1 & devicePixelRatio未対応ブラウザ */
    .className {
    width: 100px;
    height: 100px;
    background: url(test@1x.png); /* 等倍の画像 */
    }

    /* devicePixelRatio=1.5以上 */
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    .className {
    background: url(test@2x.png); /* 2倍の画像 */
    -webkit-background-size: 100px 100px; /* WebKit */
    background-size: 100px 100px; /* WebKit以外 */
    }
    }
  4. Takazudo revised this gist Mar 11, 2011. 1 changed file with 0 additions and 16 deletions.
    16 changes: 0 additions & 16 deletions devicePixelRatio=1_1.5
    View file
    Original file line number Diff line number Diff line change
    @@ -1,16 +0,0 @@
    /* devicePixelRatio=1 & devicePixelRatio未対応ブラウザ */
    .className {
    width: 100px;
    height: 100px;
    background: url(test@1x.png); /* 等倍の画像 */
    }

    /* devicePixelRatio=1.5以上 */
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    .className {
    background: url(test@2x.png); /* 2倍の画像 */
    -webkit-background-size: 100px 100px; /* WebKit */
    background-size: 100px 100px; /* WebKit以外 */
    }
    }
  5. @tacamy tacamy created this gist Mar 11, 2011.
    16 changes: 16 additions & 0 deletions devicePixelRatio=1_1.5
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    /* devicePixelRatio=1 & devicePixelRatio未対応ブラウザ */
    .className {
    width: 100px;
    height: 100px;
    background: url(test@1x.png); /* 等倍の画像 */
    }

    /* devicePixelRatio=1.5以上 */
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5),
    only screen and (min-device-pixel-ratio: 1.5) {
    .className {
    background: url(test@2x.png); /* 2倍の画像 */
    -webkit-background-size: 100px 100px; /* WebKit */
    background-size: 100px 100px; /* WebKit以外 */
    }
    }