我正在使用Metro-UI-CSS，但遇到了问题，需要帮助。请参阅打击图像。我也想知道我可以在同一页面中使用JQuery 1和2。
<body class="metro">
<div style="padding: 10px 0;" class="container">
<div style="padding: 10px 0;" class="container">
<div class="grid no-margin">
<div class="row no-margin">
<div class="span6">
<div class="span3 bg-amber padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Company Infomation</h3>
</div>
<div class="span3 bg-red padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Latest Travel News</h3>
</div>
<div class="span3 bg-lighterBlue padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Book with Confidence</h3>
</div>
<div class="span3 bg-pink padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Quick links</h3>
</div>
</div>
<div class="span6">
<div class="padding10 bg-orange">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">
Cheapest Flight Tickets for Worldwide Destinations</h3>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
目前来看：
http://i.stack.imgur.com/FxISt.png
我需要这个：
http://i.stack.imgur.com/1nlbh.png
最佳答案
好吧，经过反复摆弄，这就是你的结果。
基本上，您正在制作一个带有1行的大网格。在span6（左侧）中，您要制作另一个包含两行并因此包含4个按钮的网格。
另一个span6（右侧）用于橙色大div，其宽度等于左侧两行的高度。
希望很清楚
<body class="metro">
<div style="padding: 10px 0;" class="container">
<div class="grid no-margin">
<div class="row no-margin">
<div class="span6">
<div class="grid no-margin">
<div class="row no-margin">
<div class="span3 bg-amber padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Company Infomation</h3>
</div>
<div class="span3 bg-red padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Latest Travel News</h3>
</div>
</div>
<div class="row no-margin" style="padding:10px 0">
<div class="span3 bg-lighterBlue padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Book with Confidence</h3>
</div>
<div class="span3 bg-pink padding10">
<h3 style="padding:0 0 20px 10px; font-size:1.2em" class="border-bottom fg-white">Quick links</h3>
</div>
</div>
</div>
</div>
<div class="span6">
<div class="grid no-margin">
<div class="row no-margin">
<div class="span6 padding10 bg-orange" style="height:180px">
<h3 style="padding:0 0 20px 10px; font-size:1.2em; " class="border-bottom fg-white">Cheapest Flight Tickets for Worldwide Destinations</h3>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
关于jquery - 响应Metro-UI-CSS，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/21587390/