レスポンシブWebデザイン

レスポンシブWebデザイン(RWD)は、スクリーンのサイズ、プラットフォーム、オリエンテーションに基づいて様々なデバイスで最適のサイトを生成するのウェブデザインとその開発のアプローチ方法を呼びます。

RSS

  • 受付中

    回答
    0

    monaca iPhone viewportが効かない

    monacaにて現在、iPhone端末向けのアプリを作成しており、HTML自体はWebサーバーにアップしており、jqueryでWebサーバーで取得したHTML(body部分のみ)を取得し、bodyタグに出力しているのですが、iPhone5iS端末で確認すると画面幅が大きく横スクロールが発生してしまう状況です。下記のmonacaのJSを利用してもうまくレスポン

    • 0評価
    • 42PV
    t-morita-logic t-morita-logic 6日前
  • 解決済

    回答
    1

    自動で読み込まれたcssファイルを無効にしたい

    カラーミーショップでサイトを構築しています。 自動で読み込んでいるレスポンシブ用のcssファイル(colormekit-responsive.css)を 無効にしたいのですが、そのcssファイル自体には触れませんし、 cssファイルの読み込み記述のあるhtmlはコメントアウトなどの修正ができない箇所です。 外部cssファイルで上記のレスポンシブ用

    • 0評価
    • 70PV
    surftrip371 surftrip371 1週間前
  • 受付中

    回答
    0

    レスポンシブデザインにて、iframeで外部サイトを表示した場合

    実現したいこと レスポンシブデザインのサイトにて、iframeで外部サイトのページを表示する。 発生している問題 スマートフォンで確認した場合、iframeで表示した部分のみがズームアップされて表示されてしまう。(PCで確認した場合大丈夫です) 試したこと viewportなどを設定してみましたが変わらず、iframeのwidth調整も効き

    • 0評価
    • 61PV
    ntbros ntbros 1週間前
  • 受付中

    回答
    2

    フォームがアンドロイドでフォーカスすると消えてしまう

    こんにちは。いつもお世話になっております。 レスポンシブでサイトを制作中で以下のjqueryプラグインを使ってドロワーメニューにしています。 http://git.blivesta.com/drawer メニュー内に設置した検索フォームがandroidだとフォーカスすると消えてしまう。 メニュー自体もcloseして消えてしまい予想検索単

    • 0評価
    • 489PV
    aki8933 aki8933 3ヶ月前
  • 受付中

    回答
    2

    投稿系のレスポンシブサイトにおける画像の扱いについて

    「投稿系のレスポンシブサイトにおける画像の扱い」についてお聞きしたいことがあります。 現在、レスポンシブのwebメディア(画像投稿機能あり)を作成しているのですが スマホ、タブレット、PCの際の画像サイズや解像度の扱いをどうするべきか悩んでおります。 PCサイズでのサムネイル画像などの投稿した場合、 スマホの場合にサイズが大きく、ページ自体が

    • 0評価
    • 104PV
    Soeji Soeji 3週間前
  • 解決済

    回答
    2

    slickスライドショーのボタンについて

    slickというjQueryプラグインを使って、レスポンシブデザインでスマホ対応のスライダーをwebsiteに実装したいのですが、矢印の色が白いままで、変更することができません。 「slick 矢印 出ない」、「slick 矢印 色」とchromeで検索することで、たくさんの関連記事が出てきたのですが、ほとんどの記事では、 .slick-prev:b

    • 0評価
    • 105PV
    revoiot revoiot 3週間前
  • 解決済

    回答
    1

    Bootstrap ブレイクポイント数だけクラスに記述、他に効果的な方法がありますか?

    基本的な質問で申し訳ございません。 今更ではありますが、Bootstrapを利用し始めました。 概要と実装まで組み始めたのですが、 1つ基本的な疑問がございます。 1.ブレイクポイント分、しっかり記述したほうが良いですか? グリッドから外れるとrowから外れて12グリッド全て使われて、 カラム落ちするのは理解したのですが、 どうもパッと

    • 0評価
    • 54PV
    Oil_man Oil_man 3週間前
  • 受付中

    回答
    1

    iPhoneでスクロールがカクカクなるのは何が原因ですか?

    今まで1度もこの現象が起きたことは無いので原因がわからず困っています。 これまで制作したサイトは -webkit-overflow-scrolling: touch; を指定しなくても滑らかにスクロールできていました。 親要素に○○○というCSSを設定しているとカクカクする...といった「原因」が知りたいです。 ※ちなみに-webkit-ov

    • 0評価
    • 100PV
    jlo5891 jlo5891 4週間前
  • 解決済

    回答
    3

    レスポンシブデザインにおける画像と文字の重ね合わせ

    レスポンシブ対応のwebsiteを作ろうとしているのですが、分からないことが出てきたため、質問させていただきます。 下記の画像を見てもらえば、分かるとは思うのですが、上側のフォームの中に「ここに文章を入れます」を入れたいのですが、なぜか重ね合わすことができず困っています。 websiteで調べた結果、絶対位置、相対位置を利用したposition:

    • 0評価
    • 117PV
    revoiot revoiot 1ヶ月前
  • 解決済

    回答
    1

    画像と文字の重ね合わせ

    レスポンシブデザインにおける画像と文字の重ね合わせがわからないところがあるため、ここで質問させていただきます。 質問 ズームした際、画像①のようにテキストがずれてしまいます。 インターネットで調べた結果、相対位置と絶対位置を用いた「position:relative;。position:absolute;」を用いて、画像②のように一時的にするこ

    • 0評価
    • 96PV
    revoiot revoiot 1ヶ月前
  • 受付中

    回答
    0

    参考になりましたか?という機能を付けたいです。

    実現したいこと ■カスタマーレビューサイトを作っています。 そこで下記のような機能を追加したいのですが、うまくできません。というか方法がわかりません。 ご教示頂けると幸いです。 [Amazonのスマホでのカスタマーレビュー]にある このレビューは参考になりましたか? 役に立った 役に立たなかった https://www.

    • -6評価
    • 293PV
    masahirock1209 masahirock1209 1ヶ月前
  • 解決済

    回答
    1

    スマホのブラウザの戻るボタンで戻ると、メイン画像の動画が再生されない

    前提・実現したいこと スマホの戻るボタンで戻ってもメインの動画が再生された状態にしたい リンク内容 発生している問題・エラーメッセージ TOP→menu→(ブラウザの戻るボタン)→TOPと遷移するとメインの動画が固まって再生されない。 該当のソースコード <html lang="ja"> <head> <meta charset="UTF

    • 0評価
    • 73PV
    ryota0315 ryota0315 1ヶ月前
  • 受付中

    回答
    0

    ハンバーガーメニュー(ドロワーメニュー)が押せない。

    発生している問題・エラーメッセージ ハンバーガーメニューが押せません。押しても動作しません。 デベロッパーツールでは、問題なく動作しています。 h1の右横になるようにしています。 重なってはいないと思うのですが・・・ 該当のソースコード <nav id="nav" class="fixed"> <h1><a href="index.html

    • 0評価
    • 72PV
    identity0xx identity0xx 1ヶ月前
  • 解決済

    回答
    3

    ヘッダーメニューのレスポンシブ化

    現在作成しているWebページのヘッダーを、画面サイズに合わせて子要素(logo,menu1~menu4)の比率を変えずに、かつ、背景画像が見切れることなく縮小したいのですが、どうすればいいでしょうか。 要素headerには幅、高さの指定はなし headerの子要素のheadermenuのmax-widthは1034px headermenuの子要素

    • 0評価
    • 166PV
    nosonosolife nosonosolife 1ヶ月前
  • 受付中

    回答
    1

    CSSのみでスライドショーにしたいのですが、PCとスマホで動作が異なってしまいます

    前提・実現したいこと CSSのみでメイン画像5枚をスライドショーをで表示させたい 発生している問題・エラーメッセージ PCではやりたいことが実現できましたがスマホ(iphone)で確認をすると動作が異なってしまいます。 レスポンシブで対応を行いたいです。 該当のソースコード <div class="mainPhoto">

    • 0評価
    • 68PV
    ryota0315 ryota0315 1ヶ月前
  • 解決済

    回答
    1

    レスポンシブ以外のスマホ、PC表示切り替えについて

    一般的なレスポンシブデザインでは、アクセスしている環境の画面のサイズでCSSの表示を切り替えることが多いと思います。(metaのviewportとCSSのmedia query) そのため、PCのブラウザでも幅を狭めるとスマホ表示用のCSSに切り替わります。 その他の方法として.htaccessで端末を識別して切り分ける方法もあるかと思います。 そ

    • 0評価
    • 135PV
    r_iida r_iida 1ヶ月前
  • 解決済

    回答
    1

    レスポンシブデザインでのselect要素のoptionが長い場合の対処ってどうしてます?

    レスポンシブデザインでのselect要素のoptionが長い場合の対処ってどうしてます? 今まであまり長い文字列を使用した事がないので、焦ってます オススメの対処法などないでしょうか? selectのwidthで幅を制限しても全て表示されないのはどうかと思いますし 省略も同様かと

    • 0評価
    • 418PV
    hyksm hyksm 1ヶ月前
  • 解決済

    回答
    1

    CSSのみで画像とテキストをスライドショーにしたい

    前提・実現したいこと CSSのみでスライドショーを実現させたいのですが、うまく行きません。 画像の上に乗っているテキストも同じようにスライドショーにしたいです。 何がうまくいかない原因なのかを教えていただきたいです。 <div class="mainPhoto"> <p>違<span>いのわかる</span>大人<span

    • -3評価
    • 121PV
    ryota0315 ryota0315 1ヶ月前
  • 解決済

    回答
    1

    cssフレームワークBulmaのモバイル対応について

    お世話になっております。 CSSフレームワークのBlumaを利用して、レスポンシブ対応のサイトを作成しています。 navの部分ですが、PCでブラウザ幅を変更した場合には反応するのですが、chromeでiPhoneやiPad等の見え方を確認すると反応しておらず、見にくいですしタップもしにくいです。(iPhoneの実機でも同じ状況でした) bulmaの

    • 0評価
    • 370PV
    ao_love ao_love 1ヶ月前
  • 解決済

    回答
    1

    CSSのレイアウトについて

    前提・実現したいこと rails4で開発中。 CSSでページのレイアウト構成をしていて2カラムの構成を実装したいと思っています。 実現したいのは上記の画像のような構成です。 発生している問題・エラーメッセージ 通常の2カラムの構成はできるのですが、メインとなる中央のカラムの中身が今回はeachメソッドで記述していて、そのeachメソ

    • 0評価
    • 79PV
    lapi lapi 1ヶ月前
1

タグ情報

  • あなたの順位

    -

  • タグ登録者数

    130

  • 総質問数

    131

  • 今週の質問数

    1

関連するタグ

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る