2017-03-24 21 views
-1

私は現在、4つの画像divを持っています。そして、私は彼らが中心から整列を開始したい。だから、もし誰かがイメージdivの未来を追加すると、それは自動的に中心に揃う。 可能ですか?複数の画像divを中央から揃える方法は?

+0

いいえ、それはできません。私たちはhtmlを持っていないので、初期の努力です。確かに不可能です。 –

+0

私はそれらの "4つの画像のdiv"を見ることができません – Swellar

+0

@カールジャンクあなたはそれらを想像する必要が多分、あなたの脳を使用して、あなたの目を使用しないでください。まあ、この技術はかなり難しいです。想像して推測するのは簡単ではありません。 –

答えて

2

は、ブートストラップによって提供されるグリッドテンプレートを使用し、親をコンテナとして設定します。

HTML

<div class="container"> 

<div class="col-md-3"> 
<img src="https://pmcvariety.files.wordpress.com/2016/11/beauty-and-the-beast-trailer.jpg?w=1000&h=563&crop=1" alt="disney"> 
</div> 

<div class="col-md-3"> 
<img src="https://pmcvariety.files.wordpress.com/2016/11/beauty-and-the-beast-trailer.jpg?w=1000&h=563&crop=1" alt="disney"> 
</div> 

<div class="col-md-3"> 
<img src="https://pmcvariety.files.wordpress.com/2016/11/beauty-and-the-beast-trailer.jpg?w=1000&h=563&crop=1" alt="disney"> 
</div> 

<div class="col-md-3"> 
<img src="https://pmcvariety.files.wordpress.com/2016/11/beauty-and-the-beast-trailer.jpg?w=1000&h=563&crop=1" alt="disney"> 
</div> 

</div> 

私は、これはあなたが望むものであることを理解したよう?

Full Layout

+0

どのような素晴らしい心の読者ですか? OPは彼の問題をとてもうまく説明していないので。したがって、あなたのような心の読者がOPの言葉を(実際の問​​題について)何か意味のある明確なものに翻訳できるかどうかは素晴らしいことです。このような***私は彼らがセンター***をalinging開始したい、この***誰かがそれが自動的に中心***に整列するより多くの画像div未来を追加すれば?だからあなたのデモは、少なくともOPのシナリオを反映する必要があります。 –

+0

質問者の方に質問してください。***これは好きですか?*** - 回答者は質問者を徹底的に理解できません。この種の質問は、コメントとしてのみ記載してください。ところで、私は***のようなものが良いと言っています。私が理解しているように、これはあなたが望むものです***。それははるかによく聞こえる。 –

0

はい、ちょうどあなたがコードの下に試すことができ可能です。

<div class ='container'> 
    <div class ='container-inner'> 
     <div class ='image'> 
     <img src=''> 
     </div> 
     <div class ='image'> 
     <img src=''> 
     </div> 
     <div class ='image'> 
      <img src=''> 
     </div> 
    </div> 
</div> 

    <style> 
    .container{ 
    width:100%:; 
    } 
    .container -inner{ 
    display: table; 
    margin:auto; 
} 
.image{ 
    float : left; 
} 
</style> 

上記のコードは、すべてのイメージコンテナを中央に配置するのに役立ちます。 イメージを1つ追加すると、イメージの幅とアライメントの中心となる幅だけが使用されます。

関連する問題