2016-11-02 8 views
0

私はブートストラップを使ってランダムな見積もりページを作成しましたが、私のページの内容はウィンドウサイズを小さくするとコンテナ流体から になります。どうすれば変更できますか?あなたは小さいフォント、ボタンのサイズ、画像のスケール、オーバーフローメニューに切り替える必要があるかどうかを判断するためにメディアクエリ(https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries)を使用してみて、あなたのCSSで http://codepen.io/Juan1417/pen/wowevJ私のページのレスポンシブなデザイン

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
<link href="https://fonts.googleapis.com/css?family=Anton|Dancing+Script" rel="stylesheet"> 
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.6.3/css/font-awesome.min.css"> 

<div class="container-fluid text-center"> 

    <div class="row"> 
     <div class="col-md-8">  
     <h1 id="title1">Random quote generator.</h1> 
    </div> 

    </div>  
    <div class="row"> 
     <div class="col-md-8"> 
    <blockquote> 
     <p id="quote">"Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante."</p> 
     <footer id="author">Author</footer> 
     </blockquote>  
      </div> 
     <div class="col-md-8"> 
     <i class="fa fa-quote-right fa-3x" aria-hidden="true"></i> 
     </div> 

    <div class="row"> 
     <button id="button1"class="btn btn-default" type="submit">New Quote</button> 
     <button id="tweetButton"class="btn btn-default" type="submit">Tweet Quote</button> 

    </div> 


    </div> 

答えて

0

、または:ここ

は私のページです小さなフォームファクタのために要素を完全に排除することさえできます。

関連する問題