怎么用bootstrap写响应式的网页

使用Bootstrap编写响应式网页的步骤如下：

1. 在HTML文档中引入Bootstrap的CSS和JS文件：

<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/4.3.1/css/bootstrap.min.css">
<script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdn.bootcss.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

2. 在HTML文档中定义响应式布局的网页结构，使用Grid系统进行布局：

<div class="container">
    <div class="row">
        <div class="col-lg-6 col-md-12 col-sm-12">
            <p>左侧内容</p>
        </div>
        <div class="col-lg-6 col-md-12 col-sm-12">
            <p>右侧内容</p>
        </div>
    </div>
</div>

3. 使用Bootstrap提供的CSS样式进行页面设计，例如按钮、表格、表单等。

4. 在CSS样式中使用media query，使不同的屏幕尺寸下展示不同的样式：

@media (max-width: 768px) {
    /* 在小屏幕下的样式 */
}
@media (min-width: 768px) and (max-width: 992px) {
    /* 在中等屏幕下的样式 */
}
@media (min-width: 992px) and (max-width: 1200px) {
    /* 在大屏幕下的样式 */
}
@media (min-width: 1200px) {
    /* 在超大屏幕下的样式 */
}

以上是使用Bootstrap编写响应式网页的基本步骤。