Question

我想将http://www.miniclip.com/webmasters/8-ball-pool-multiplayer/en/中的任何游戏插入到我的网站中，但是当我这样做并尝试使屏幕变小时却没有响应。有没有办法用bootstrap或其他东西制作它？

Answer 1

首先，在您发送的链接上选择全宽！

我创建了一个示例here

.container {
  background: #e3e3e3;
  margin-bottom: 20px;
  padding-bottom: 50px;
}
h1, h4 {
  text-align: center;
  margin-bottom: 50px;
}
h1 i {
  color: pink;
}

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet"/>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet"/>
<h1>Bootstrap 3 Responsive video Embeds <i class="fa fa-heart"></i></h1>
<h4>Check out more <a href="http://panayiotisgeorgiou.net">www.panayiotisgeorgiou.net</a> for more awesome web dev things</h4>

<div class="container">
  <div class="row">
    <div class="col-sm-6">

      <h2>16:9 Responsive Aspect Ratio</h2>
      <div class="embed-responsive embed-responsive-16by9">
        <iframe class="embed-responsive-item" src="https://www.youtube-nocookie.com/embed/JYv7Ibml4ro"></iframe>
      </div>
    </div>
    <div class="col-sm-6">


      <h2>4:3 Responsive Aspect Ratio</h2>
      <div class="embed-responsive embed-responsive-4by3">
        <iframe class="embed-responsive-item" src="https://www.youtube-nocookie.com/embed/JYv7Ibml4ro"></iframe>
      </div>
    </div>
    <h2>Miniclip Embed</h2>
    <!-- Place this code where you'd like the game to appear -->
<div class="miniclip-game-embed" data-game-name="8-ball-pool-multiplayer" data-theme="0" data-width="100%" data-height="560" data-language="en"><a href="http://www.miniclip.com/games/8-ball-pool-multiplayer/">Play 8 Ball Pool</a></div>
<p style="text-align:center;"><a href="http://www.miniclip.com/games/8-ball-pool-multiplayer/" target="_blank">Play 8 Ball Pool</a> / More <a href="http://www.miniclip.com/games/genre-3/" target="_blank">Sports games</a></p>

<!-- Insert this code before your </body> tag -->
<script src="//static.miniclipcdn.com/js/game-embed.js"></script>
  </div>
</div>

，看看，让我知道。

如何在我的网站上添加响应式游戏？

1 个答案: