我正试图使表更具移动响应性，并遇到列标题问题。
现在，桌面上的列标题为“显示颜色”，“向上”和“向下”。理想情况下，当切换到移动设备时，“上”和“下”将移动到各行，这样，例如，该行将代替“ A：”，而下一行应为“ A：Up”。答：“下来”或类似的内容。是否有内置的方法可以在引导程序中执行类似的操作？
here是一个jsbin，您可以通过调整宽度来了解我的意思。当前，当您调整为移动设备尺寸（也称为较小尺寸）时，尚不清楚哪个下拉菜单用于“ Up”，哪个下拉菜单用于“ Down”
代码如下：
<!-- views/profile.ejs -->
<!doctype html>
<html>
<head>
<title>Title</title>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<link rel="stylesheet" type="text/css" href="/stylesheets/main.css" />
<meta name="viewport" content="width=device-width,initial-scale=1,shrink-to-fit=no">
<style>
body { padding-top:80px; word-wrap:break-word; }
</style>
<script>
<link rel="stylesheet" type="text/css" href="/js/scripts.js" />
</script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-4 text-left">
<strong>Display Color</strong>
</div>
<div class="col-md-4 text-left">
<strong>Up</strong>
</div>
<div class="col-md-4 text-left">
<strong>Down</strong>
</div>
</div>
<div class="row">
<div class="col-md-4 text-left">
<strong>A:</strong>
</div>
<div class="col-md-4 text-left">
<select class="bootstrap-select btn col-md-12" name="color1U" autocomplete="off">
<option name="name0" value="0"
>white<span class="colorRectangle"></span>
</option>
<option name="name1" value="1"
>red<span class="colorRectangle"></span>
</option>
<option name="name2" value="2"
>orange<span class="colorRectangle"></span>
</option>
</select>
</div>
<div class="col-md-4 text-left">
<select class="bootstrap-select btn col-md-12" name="color1D" autocomplete="off">
<option name="name0" value="0"
>white</option>
<option name="name1" value="1"
>red</option>
<option name="name2" value="2"
>orange</option>
</select>
</div>
</div>
<div class="row">
<div class="col-md-4 text-left">
<strong>B: </strong>
</div>
<div class="col-md-4 text-left">
<select class="bootstrap-select btn col-md-12" name="color2U" autocomplete="off">
<option name="name0" value="0"
>white<span class="colorRectangle"></span>
</option>
<option name="name1" value="1"
selected="selected" >red<span class="colorRectangle"></span>
</option>
<option name="name2" value="2"
>orange<span class="colorRectangle"></span>
</option>
<option name="name3" value="3"
>yellow<span class="colorRectangle"></span>
</option>
</select>
</div>
<div class="col-md-4 text-left">
<select class="bootstrap-select btn col-md-12" name="color2D" autocomplete="off">
<option name="name0" value="0"
>white</option>
<option name="name1" value="1"
selected="selected">red</option>
<option name="name2" value="2"
>orange</option>
</select>
</div>
</div>
<input type="submit" value="Save"/>
</form>
</div>
</body>
</html>