最近はレスポンシブコーディングも多くなり、コーディングする度にデザインに合わせて
毎度ちまちまコードを書いていくのも面倒なので、コピペして使えるパーツを載せていこうと思います。
bootstrapなど便利なフレームワークも沢山ありますが、100％使用するとカスタマイズが面倒なので、
その辺は、使えそうな部分のみ抜粋して組み込んであります。
まずは、よく使うボタン。
レスポンシブのブレイクポイントは、Bootstrap のグリッドシステムに倣っています。
0 ～ [xs] ～ 768 ～ [sm] ～ 992 ～ [md] ～ 1200 ～ [lg]
inlineボタン（.button）
画面幅768px 以下でブロックボタン（.xs-block）
画面幅992px 以下でブロックボタン（.sm-block）
画面幅1200px 以下でブロックボタン（.md-block）
画面幅1200px 以上でブロックボタン（.lg-block）
おはようございます。加地です。
蒸しムシ虫・・・暑い日が多くなってきましたね。
暑いだけではなく最近は夕方になると、ゲリラ豪雨にやられてる私です。
雨は大嫌いで自転車も大嫌いな私ですが、どうも避けて通れない試練がやってきました。
いままで娘２人の保育園の送迎は車で行っていたのですが諸事情により
私が自転車で送らないといけなくなりました。
まずい。20kgと10kgの娘２人を乗せて自転車なんてハードル高すぎる。
高校時代に何度も自転車で田んぼにはまったり坂道で転倒し怪我をしている私。
私自身も4歳のころ母の自転車の後ろにのって足をはさんで大怪我もしています。
かわいい電動自転車ならなんとかなるかも♪
と少し前向きに考えてみることにしました。
さて、話は変わりまして、ちょっとお仕事チックな話題も少しだけ。
今年に入ってレスポンシブなサイト制作が増えてきました。
とはいっても一般の方は「なにそれ？」的な感じでしょう。
レスポンシブwebデザインて何？
レスポンシブWEBデザインとは、PC・タブレット・スマートフォンなどのあらゆる画面サイズへワンソースで対応したWebデザインのことを言います。近年のスマートフォンやタブレットの急速な普及に伴い、大手企業をはじめとして導入が進んでいる注目の開発手法です。モバイルファーストだとgoogleが推奨しはじめてから、さらに加速しています。
私自身としては海外も含め素敵なレスポンシブサイトを見るのが電車内での日課になってきたので、
（なにしろスマホでみやすいので）いまの楽しみのひとつです。
ちゃんとホームページはあるしSEO対策もばっちり！ブログもしているからいいかーというサイトもまだまだ多いですが
今やタブレットやスマホがあたりまえの時代。買い物やネットもスマホが主流になってきているので
多少コストがかかっても「レスポンシブ対応」導入はおすすめです♪