css bootstrapのメモ

2015.11.02 Monday 23:49
0
    css bootstrapのメモ

    -------------------------------------------------
    .col-xs- モバイル(768px以下)
    .col-sm- タブレット(768px以上、992px未満)
    .col-md- デスクトップ(992px以上、1200px未満)
    .col-lg- デスクトップ(1200px以上)
    -------------------------------------------------

    たとえば、
    モバイル(768px以下)とタブレット(768px以上、992px未満)の場合は
    の画面幅の場合は、中央一列でその下にサイドバー表示で
    デスクトップ(992px以上、1200px未満)とデスクトップ(1200px以上)の場合は、
    の画面幅の場合は、中央の横ににサイドバー表示する設定が以下

    -------------------------------------------------
    <div class="row">
    <!-- 中央に割り当て -->
    <div class="col-xs-12 col-sm-12 col-md-9 col-lg-9">

    <!-- サイドメニュー -->
    <div class="col-md-3 col-lg-3">
    </div>
    /div>

    -------------------------------------------------

    要するに、.col-xs-★の場合
    12/★の値が占領する列の数になる

    category:css | by:ittoocomments(0)trackbacks(0) | -

    印刷用css 表示と非表示

    2015.01.20 Tuesday 22:08
    0
      <html>

      <head>
      <link rel="stylesheet" href="default.css" type="text/css" />
      <link rel="stylesheet" href="print.css" type="text/css" media="print" />
      </head>

      <body>

      <div id="for_print">
      ■1 for_print 印刷表示用
      </div>
      <div id="for_detail">
      ■2 for_detail 一般詳細表示用
      </div>


      </body>
      </html>


      print.css
      #for_print{
      visibility:visible;
      display: block;
      font-size:24px;
      }
      #for_detail{
      display: none;
      }




      default.css
      #for_print{
      display: none;
      }
      #for_detail{
      visibility:visible;
      }
      category:css | by:ittoocomments(0)trackbacks(0) | -

      !importantでIEに別の値を指定

      2007.05.21 Monday 19:23
      0
        ブラウザ間で表示が異なることへの対応。
        css表示で !important をつかって、IEにのみ別の指定をすることが可能。

        例)
        margin-top :15px !important; /* IE以外 */
        margin-top :5px ; /* IE */

        category:css | by:comments(0)trackbacks(0) | -

        li,ul使用時に表示されてしまう、マークを表示しない方法。

        2007.05.11 Friday 06:51
        0
          css で li ul 使用時に表示されてしまう、マークを表示しない方法。
          「list-style: none;」
          を指定するよ。ul に表示するのがよいだろうね。

          category:css | by:comments(0)trackbacks(0) | -

          IEのcssでfloatすると上下の位置がずれる?

          2007.01.01 Monday 00:42
          0
            IEで cssにおいて、floatを使用すると
            上下の位置が若干、ずれてしまう場合があるなぁ。

            今回、「float:left;」を利用して
            img画像を2つ並べたんだけど
            右側に回りこんだ画像が 1pxくらい左画像に比べて
            下にずれてた。
            なぜかはわからんが、float を使う場合には気をつけよう。

            category:css | by:comments(0)trackbacks(0) | -

            ad
            Calender
               1234
            567891011
            12131415161718
            19202122232425
            2627282930  
            << November 2017 >>
            Selected entry
            PR
            Category
            Archives
            Recent comment
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              66hills
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              ssd
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              max
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              DOM
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              DOM
            • コンピュータ業界の根本的な変化
              cloud
            • コンピュータ業界の根本的な変化
              Dellの仮想化
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              えちごや
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              touch
            • マクドナルドでYahoo BBモバイルポイント 公衆無線LANサービスがつながらない
              bob77777
            Recent trackback
            • スマートフォンの法人活用例
              無線LANネットのブログ
            • Yahoo!オークションからのアフィリエイト収入が一気に70%減になってしまい涙目になってる話
              特選情報
            Recommend
            Link
            Profile
            Search
            Others
            Mobile
            qrcode
            Powered
            無料ブログ作成サービス JUGEM