1

Railsは初めてで、最初のWebアプリケーションの作成が完了しました。現在、アプリのスタイリングを検討しています。自分のアプリがさまざまなデバイスでどのように表示されるかを考える必要があることはわかっていますが、その方法や最善の方法がわかりません。ページがどのデバイスでレンダリングされていても、標準の外観にする方法はありますか?

私はラップトップでの外観に合わせてオブジェクトを動かし始めましたが、タブレットでページを見ると、あるべき場所にとどまるものもあれば、ページの端から消えて基本的に私が持っていたスタイルを台無しにするものもあります(絶対測位の使用と関係があると思います)。デバイスに合わせてページを最適化するのではなく、ユーザーがデバイスをズームインおよびズームアウトする必要がある、石に設定されたページをデバイスに表示させたいだけだと思います。

どんな助けでも大歓迎です。ありがとう

4

3 に答える 3

2

CSSメディアクエリを使用して、画面の幅/高さに応じてCSSルールを最適化/変更することをお勧めします。これらはクライアントのブラウザによって適用される通常のCSSファイルであるため、自分の側でそれらをいじくり回す必要はありません。

次に例を示します。

@media all and (max-width: 430px) and (min-width: 360px) {
  /* put your mobile css in here */
}
于 2012-08-28T10:36:38.697 に答える
2

それはかなり良い質問です。それを実行するための解決策は、twitterブートストラップフレームワークを使用することです。そのためのgemをgemファイルに含めてバンドルする必要があります。'bootstrap-sass'、'2.0.0'。その後、カスタムcssにインポートし、必要に応じて使用します。Bootstrapは、Twitterの優れたチームによる応答性の高いフレームワークです。ブートストラップが基本的に提供するのは、応答性の高いフレームワークであり、アプリがそれに応じて調整する画面サイズに関係なく、クライアントの画面に応じてアプリが自動的に次元を調整できるようにします。それはそれをそのように機能させるグリッドシステムを持っています。

あなたはあなたが探しているものを達成するのを助けるいくつかのサイトを訪問したいと思います、ここでブートストラップについてもう少し学びましょうhttp://twitter.github.com/bootstrap/ またあなたの問題のために私が推薦した宝石はそれでSass機能を持っていますまた、 http://sass-lang.com/tutorial.htmlもチェックしてみてください。

于 2012-08-28T10:43:43.273 に答える
1

メディアクエリを読む必要があります。Twitterブートストラップは優れたフレームワークですが、既に気に入ったCSSをお持ちの場合(または単に新しいことを学びたい場合)は、メディアクエリを使用して独自のレスポンシブデザインを設定できます。始めるのに適切な場所は、モバイルサイトの作成に関するこのSmashingMagazineの記事です。

誰もが愛し、レスポンシブデザインが組み込まれている今月のフレームワークからやり直したい場合は、Twitter Bootstrapをチェックしてください。このフレームワークには、使い始めるのに役立つ非常に優れたドキュメントがあります。

于 2012-08-28T14:17:20.230 に答える