Question

最近，我从youtube上下载了学习bootstrap 4的视频，用于响应式网页设计，当我使用时，一切正常 <div class="col-md-6>媒体屏幕的md类和大屏幕的lg类工作正常但是xl类用于小型设备，而小型设备的sm类无论我如何缩放页面，我都下载了响应式网站测试扩展铬但仍然没有。这是代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Learn BOOTSTRAP CSS</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="css/bootstrap.min.css">

    <script src="js/jquery-3.2.1.min.js"></script>
</head>
<body>
<div class="container">
    <div class="row">
# this is the parent class and it should take the entire page width
<div class="col-lg-6 col-md-6 col-sm-12 bg-primary">
    <p>this is the primary color</p>
    <div class="row">
      # and this is the child class and it should take 6 col of it parent class
    <div class="col-lg-6 col-md-6 col-sm-6 bg-success">
    <p>this is the success color</p>
    </div>
</div>
</div>

    </div>
</div>
</body>
</html>

Answer 1

看起来我没有工作因为我使用的是Bootstrap 4，当我使用bootstrap时 3代码对我来说很好

我有一个bootstrap 4的问题

1 个答案: