html - 创建Bootstrap面板和样式

大家好，他们一直在使用引导面板，并试图理解所有内容。我正在尝试在其他面板中重新创建一些面板。

例如，该网站：Website

正在使用引导程序面板进行复制。这是我尝试使用面板重新创建的内容，但是我不确定2如何做到这一点。
到目前为止，我已经完成了此操作，但它看起来根本不像网站上的那个

码：

<div id="mainContainer" class="container">
  <div class = "pannels">
    <div class="panel panel-default">
      <div class="panel-heading">Panel Title</div>
      <div class="panel-body">
        <div class="row">
          <div class="col-lg-2 col-md-3 col-sm-4 col-xs-6">
            <div class="panel panel-default">
              <div class="panel-body">
              </div>
            </div>
            <div class="panel panel-default">
              <button type="button" class="btn btn-success">Success</button>
            </div>
          </div>
          <div class="col-lg-10 col-md-9 col-sm-8 col-xs-6">
            <h4>
            List Title
            </h4>
            <ul class="list-group">
              <li class="list-group-item">Item One</li>
              <li class="list-group-item">Item Two</li>
              <li class="list-group-item">Item One</li>
              <li class="list-group-item">Item Two</li>
              <li class="list-group-item">Item One</li>
            </ul>
          </div>
        </div>
      </div>
      <div class="panel-footer">
      Here comes some text
      </div>
    </div>
  </div>
</div>

我正在尝试将所有内容调整为正确的大小。因此，例如，我的图片标签与网站相比大小不合适，我在重新创建它时遇到了问题。我还努力缩小整个面板的面积。我不确定是否应该使用CSS来执行此操作或引导程序等。

无论如何，任何帮助都会很棒。

谢谢

最佳答案

使用CSS。因此，在您的head标签中，添加一个指向您自己的CSS文件的链接，该链接会添加您想要的样式。但是请确保在链接Bootstrap CSS文件后将其列出。

例如

<link rel="stylesheet" type="text/css" href="--Bootstrap URL Here--"/>
<link rel="stylesheet" type="text/css" href="myCustomCSSFile.css"/>

然后在myCustomCSSFile.css中放入类似内容：

panel > panel {
    height: 50%;
    background-color: orange;
}

或您想要的任何样式。

这是CSS教程：W3Schools CSS Tutorial

关于html - 创建Bootstrap面板和样式，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/35579955/