以前の要素を手動で再配置せずにページに要素を追加する

HTMLファイルに新しい要素を追加する場合を考えてみましょう。あなたは他のすべての要素の位置を編集しますか？これについてもっと良い方法がありますか？以前の要素を手動で再配置せずにページに要素を追加する

たとえば、div要素とリストが2つあるレイアウトがありました。私は時間をかけて、すべてのものをページ上で見事に見せてくれました。私は別のdiv要素を追加することにしました。そして突然すべてが駄目です。

2017-02-27 vampiire

'twitter bootstrap'、' materialize'などのレスポンシブなデザインフレームワークを確認しましたか？ –

@Guruprasad Rao正直言って、あなたがちょうど私に言ったことは全く分かりません。私はちょうど数週間前に始めました、私はウェブデザインにはとても新しいです。私は私の質問を適切に言い表しているとは思わない。なぜなら、私はグーグルを通じてアドバイスを見つける運がなかったからだ。 – vampiire

ちょっと心配しないでください。あなたが問題をより正確にして、コードを追加して、正確にあなたが助けを必要としていることを伝えればいいと思います。私が前に言ったような特定のフレームワークがあります。あなたのウェブアプリケーション/サイトをスタイルアップするための美しいコンポーネントを提供するだけでなく、応答性を提供してさまざまなデバイス用の異なるスクリーンを作成するオーバーヘッドを削減します。これらのフレームワークを照会するだけですべてが説明されます。正確：.. –

あなたの質問は非常に開放的ですが、私はちょうど私の2セントを与えると思っています。

を入力してください：あなたはフレキシボックスのCSSプロパティとなり、（自分のページのレイアウトが自動的に表示されている、それを通してスクリーンに応じて調整を意味し、応答）応答性の設計に使用できるフレキシボックス

1つのツール。

この簡単な例を編集して、これを実際に表示しました。この例では、単に親要素のCSS数行のコードを使用しますが、要素のサイズを変更し、自分自身を再配置子（ボックス）を行う自動的に画面サイズに基づいて、他のスタイリングを必要とせず：

display: flex; 
flex-flow: row wrap; 
justify-content: space-around;

ビューsimple flexbox sample

**あなたがそのフィドルにいると、ブラウザのサイズを変更したり、ズームインしたりズームアウトしたりして、ボックスが自動的に自分自身の位置を変える方法を確認してください。は魔法のようです！

興味がありますか？ここにあなたを始めるための何かがあります：Guide to Flexbox

これは役に立ちます！

出典

2017-02-27 08:46:41 Noel

非常にきちんとありがとうございます。私はブートストラップを調べましたが、私は母国語でのやり方について学びたいと思っています。 – vampiire

レイアウトで新たに追加されたすべての要素の位置とCSSを調整する必要があります。非常にまれですが、物事は定位置にあります。しかし、bootstrapのようなレスポンシブなCSSを使用すれば、仕事は少なくなります。

出典

2017-02-27 04:40:00

ああ、うわー。それを行うより効率的な方法はありますか？手動で左を変更するのではなく、/ top：と余白を変更し、プレビューページで変更を確認することをお勧めします。 – vampiire

私はブートストラップを調べます。ありがとうございます – vampiire

以前の要素を手動で再配置せずにページに要素を追加する

答えて

関連する問題