Question

<header class="row">
  <div class="logo-box col-sm-6 col-xs-12">
    <img class="header-logo img-responsive" src="https://s3-us-west-1.amazonaws.com/udacity-content/rebrand/svg/logo.min.svg" alt="udacity logo" />
  </div>
  <div class="nametag col-sm-6 col-xs-12">
    <h1>SIYU WU</h1>
    <p class="personal-title">
      FRONT-END WEB DEVELOPER
    </p>
  </div>
</header>

相关风格如下所示：

header {
  display: flex;
}
.logo-box {
  padding-top: 40px;
  height: 120px;
}

.header-logo {
  width: 300px;
  height: 53px;
}

.nametag {
  padding-top: 20px;
  height: 120px;
}

我正在使用bootstrap的框架，但它似乎无法正常工作。无论屏幕尺寸如何，两个div都占50％宽度。但是如果我删除了第二个div，那么第一个div将在xs大小的屏幕上占据100％的宽度。

Answer 1

引导列系统取决于@pytest.fixture(scope="class") def my_fixture(request): def fin1(): print("fin1") request.addfinalizer(fin1) def fin2(): print("fin2") request.addfinalizer(fin2) display的{{1}}。

通过将其更改为.row，您已经破坏了它。 flex元素的子元素有不同的包装规则。

bootstrap网格系统col-xs-12无法正常工作

1 个答案: