我玩引导4,虽然在我无法找到一个解决方案,以增加响应能力卡div用class="card-columns"(本类应用砖石般的效果的卡有这个类的DIV中).
在引导3是容易款式,使"卡片"响应,因为它是可以应用类似class="col-md-3 col-sm-6 col-xs-12"包含一个div thumbnail,caption等等.
在Bootstrap 4中使用卡时如何获得相同的效果?
这是HTML:
<body>
<div class="container-fluid">
<div class="row">
<div class="col-md-4 hidden-sm-down" id="map_container">
<p>here we put the map</p>
</div>
<div class="col-md-8 col-sm-12 right_box">
<div class="row">
// here there's code for navbar
</div><!-- row -->
<div class=row">
<div class="card-columns">
<?php
// Create and check connection
if ($result->num_rows > 0) {
// output card design
while($row = $result->fetch_assoc()) {
echo '<div class="card">
<img class="card-img-top" src="dance' . $row["id"] …Run Code Online (Sandbox Code Playgroud) 我想使用CSS来呈现两列布局.我正在使用的标记就是这个
<div style="-webkit-column-count: 2;
-webkit-column-rule: 1px solid black;
-webkit-column-width: 80px;
margin-left:20px;margin-top:20px;">
<div id="picturebox" style="">picture box</div>
<div id="nme">name</div>
</div>
Run Code Online (Sandbox Code Playgroud)
有没有办法让一列宽度为20px,一列宽度为80px?