【RWD ーレスポンシブー】右にできた謎の余白を消す方法 | バシャログ。
こんにちは。mackyです。 じめじーめな日々のせいなのでしょうか。6月がとても長く感じます。 今日は右にできた謎の余白を消す方法をまとめます。 そもそも余白って？ できあがったサイトをipadやiphoneで表示確認したとき、以下のような余白ができたことはないですか？ 先日、携わった某サイトはiphoneとipadで表示チェックを行ったのですがその際右のスクロールバーの横に白い余白ができてしまいました。ヘッダーも背景画像もそこで切れてしまいます。その時色々試してみて解決した方法をメモしておこうと思います。（サンプルコードは一部内容を変更しています。） サイトの大まかな構成としては、bodyにwidth:100%;。 内側（ipadおよびiphoneで見切れないで表示させたい幅）sectionに固定サイズの1024pxを指定しました。 ipadとiphoneでみてみたら… (※下の図はip
【RWD ーレスポンシブー】PCとSPで違う画像を表示させる | バシャログ。
こんにちは。mackyです。 今日はタイトル通り、PCとSPで違う画像を表示させる方法を紹介します。 ちなみに、初心者向けです。では早速。 <p class="logo"><img src="img/img_sp.png" width="100" height="100" alt="c-brains"></p> とりあえず、これだけでいいです。 みてわかるとおもうのですが、imgタグで埋め込んでいるのは、SP用の画像です。 css CSSも割とシンプルです。 img { vertical-align: top; } @media only screen and (max-width: 640px) { img { width: 100%; height: auto; } } .logo { width: 300px; height: 300px; margin: 0 auto; backg
【スマートフォン制作向け】radioボタンをCSSのみでカスタマイズ | バシャログ。
こんにちは、GWは神奈川県から一歩も出ませんでした ishida です。 さてさて、今回は最近スマートフォン案件が増えてきましたので実務で使えそうなコーディングTipsをば。 スマートフォンでは、radioボタンがデフォルトのままだとかなり押しにくいですよね。 対象がスマートフォンであれば（IEちゃんを除けばOKかも）CSSだけで、意外とカスタマイズができます。 HTML HTMLのコードは以下になります。 <ul class="list"> <li><input type="radio" name="gender" id="gender1" value="1"><label for="gender1">男性</label></li> <li><input type="radio" name="gender" id="gender2" value="2"><label for="gende
iPhone・スマートフォンのポータルサイトまとめ | バシャログ。
だんだんと暖かくなってきました。マフラーをするか毎朝なやむ kimoto です。 Xperia arc も発売され、iPhone 5 の噂もチラホラと聞こえてくる昨今、ますますスマートフォン界隈がにぎやかになってきています。最近 iPhone ・スマートフォン用サイトを扱ってるポータルサイトを調べる機会があったので、ここにまとめてみようと思います。 どのサイトもスマートフォンで見ることをお勧めします。 ミートアイ とてもしっかり作られてるサイトです。 アプリも扱っており、サイトもアプリも丁寧に紹介されています。 iWorld シンプルで見易いサイトです。 カテゴリ別に分かれているので目的のサイトも探しやすいです。 Smart Japan 日本のサイトを世界に発信する、というコンセプトだそうです。 なるほど、和のテイストで味のあるデザインです。 iポー シンプルでアプリっぽいデザインのサイト
スマートフォンサイト提案を作るための参考資料とツール | バシャログ。
こんにちは、「夜になると体温38度」が二日連続で来たinoueです。 こういうのも風邪なんでしょうかね。ただの知恵熱？ さて、前回「Androidアプリ開発に役立つサイト7つ」というエントリーを書きましたが、 webサイトのスマートフォン対応についてもお客様にご提案させていただく機会がぐんと増えてきています。 そこで、今回はスマートフォン対応サイトの提案をする際に役に立ったサイトをご紹介します。 参考資料 2つ 実例でわかる！スマートフォンサイトの画面設計 「実践！iPhone＆Androidサイト制作ガイド」という連載の第6回目の記事です。 タイトルどおり、実際のwebサイトをスマートフォンの特徴に沿ってリデザインしていく手順を解説しています。 画面設計の際に考慮するポイントについて基本をおさえられる記事です。 iPhone アプリと Web デザイン Part.6 iPhone アプリ
スマートフォンのUIを紹介することだけに特化したサイト：TapGala | バシャログ。
フジロックに3日間行ってずぶ濡れになってきました。minamiです。 今回は軽めの話題で、iPhoneの画面デザインの参考になるサイトの紹介です。 デザインの参考でいろいろなサイトを見ることもあるかと思いますが、 今回ご紹介するTapGalaは、iPhone（スマートフォン）のインターフェイスを紹介するのに特化したサイトです。 スマートフォンのUIだけ集めたサイト：TapGala http://www.tappgala.com/ 「The best in mobile interface design」と銘打っているだけあって、様々なアプリケーションのUIをジャンル分けしてひたすら画面を紹介しています。こんなアプリもあるの？というくらい様々な例が載っているので、サービスを考えるヒントにもなるかも知れませんね。 メジャーなものになったとはいえ、スマートフォンの画面デザインはまだまだ始まったば
ドコモのケータイからGmailに電話帳データを移行する | バシャログ。
こんにちは、やっとXperiaが手に入ったinoueです。おサイフケータイが手放せず、b-mobile SIMも導入しての2台持ち体制です。 さて、Xperiaをはじめとしたドコモのスマートフォンでは「iモード非対応」が基本です。 普通のドコモ携帯からスマートフォンに機種変更した場合、「メールをどうするか」が大きな検討課題になります。 「iモードメールを何らかの方法で使い続ける」「moperaのメールを使う」といった選択肢と並んで「Gmailを使う」ことも可能です。 実際にXperiaのスタートアップガイドでは、メール設定の項目の最初に「Gmail設定」が登場しています。 Gmailの設定が完了したら、次にやることは「電話帳の移行」です。 先ほどのスタートアップガイドでは、microSDカードを介した移行方法が紹介されています。 Xperiaには16GBのmicroSDが標準装備されている
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
