miraiを探しています

カテゴリー: CSS

  • Gumbyで使うSassコンパイラGUIを「Prepros App」に変更しました

    Gumbyで使うSassコンパイラGUIを「Prepros App」に変更しました

    こちらの記事で紹介したSCOUTがなぜかエラーを吐くようになってしまったので、
    SassコンパイラをPreprosに変更しました。

    バージョンが4.2に上がったおかげか以前出ていたコンパイルエラーがなくなりました。エラーで続けてます。やっぱりおすすめは「SCOUT」
    もともとはPreprosを使いたかったので速攻で乗り換えです。
    Windowsでは一番使いやすいと評判のSassコンパイラですからね。
    (さらに…)

  • CSSハック一覧

    元記事：CSSハック一覧 – IE, Firefox, Safariなどなど

    Internet Explorer

    IE6以下

    #help_me { _color: blue; }

* html #help_me  { color: red; }

    IE7

    *:first-child+html #help_me { color: red; } 

*+html #help_me {  color: red; }

    IE6, IE7

    #help_me { /color: blue; }

    IE8

    #help_me { color: blue9; }

    IE7, IE8

    #help_me { color/***/: blue9; }

    IE6以外

    #help_me { color/**/: blue; }

    IE6, IE7以外

    html>/**/body #help_me { color: red; }

    IE6〜IE8以外

    :root *> #help_me { color: red;  }

    モダンブラウザ

    Firefox

    #help_me,  x:-moz-any-link  { color: red; }

    Firefox 3.0以上

    #help_me,  x:-moz-any-link, x:default  { color: red; }

    Safari 2-3

    html[xmlns*=""] body:last-child #help_me { color: red; }

    Safari 2 – 3.1

    html[xmlns*=""]:root #help_me  { color: red; }

    Safari 2 – 3.1, Opera 9.25

    *|html[xmlns*=""] #help_me { color: red;  }

    Safari 3以上, Chrome

    @media screen and (-webkit-min-device-pixel-ratio:0) {
 #help_me  { color: red;  }
}

    Safari 3以上, Chrome, Opera 9以上, Firefox 3.5以上

    body:nth-of-type(1) #help_me { color: red; }

body:first-of-type #help_me {  color: red; }

    Opera 9.25以上

    ;;body #help_me {  color: red; }

html:first-child #help_me {  color: red; }

  • 読みやすいフォントとサイズ

    文字が小さくて読みにくかったので
    フォント：メイリオ
    フォントサイズ：16pxに変更しました。

    CSS変更メモ

    body {
  font: 16px/1.5 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, arial, helvetica, clean, sans-serif;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",Osaka, "メイリオ", Meiryo, arial, helvetica, clean, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-variant: normal;
  font-weight: normal;
  line-height: 1.5;
}

    Before

    　吾輩は猫である。名前はまだ無い。
    　どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニヤーニヤー泣いてゐた事だけは記憶してゐる。吾輩はここで始めて人間といふものを見た。しかもあとで聞くとそれは書生といふ人間中で一番獰悪な種族であつたさうだ。この書生といふのは時々我々を捕へて煮て食ふといふ話である。

    After

    　吾輩は猫である。名前はまだ無い。
    　どこで生れたかとんと見当がつかぬ。何でも薄暗いじめじめした所でニヤーニヤー泣いてゐた事だけは記憶してゐる。吾輩はここで始めて人間といふものを見た。しかもあとで聞くとそれは書生といふ人間中で一番獰悪な種族であつたさうだ。この書生といふのは時々我々を捕へて煮て食ふといふ話である。

    参照：夏目漱石「吾輩は猫である」

    読みやすくなりました。
    雰囲気も変わって大変気に入っています。