bootstrap的使用案例

最新推荐文章于 2022-11-21 18:36:03 发布

bling flower

最新推荐文章于 2022-11-21 18:36:03 发布

阅读量122

点赞数

本文链接：https://blog.csdn.net/C05230/article/details/107847731

版权

<!doctype html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <!--1.引入viewport meta标签  -->
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- 2.引入bootstrap.min.css -->
    <link rel="stylesheet" href="../bootstrap-4.5.0-dist/css/bootstrap.min.css">

    <!-- 3.引入 jquery-3.5.0.min.js-->
    <script  src="../jquery-3.5.0/jquery-3.5.0.min.js" ></script>
    <!-- 4.引入 bootstrap.min.js-->
    <script src="../bootstrap-4.5.0-dist/js/bootstrap.min.js"></script>
    <!-- 53设置自定义样式 -->

    <title>Hello, world!</title>
    <style>
        div.container{
            height: 100px;
            background-color: #ccc;
        }
        div.row div{
            height: 50px;
            border: 1px solid red;
        }
        section{
            width: 200px;
            height: 200px;
            /* background: linear-gradient( to right, red,blue); */
            background: radial-gradient(circle,red,blue);
        }
    </style>
  </head>
  <body>
    <div class="container">
        <div class="row justify-content-md-center">
            <div class="col-ma-3 col-sm-1 col-lg-5"></div>
            <div class="col-md-6 col-sm-1 col-lg-7"></div>
            
        </div>
        
        

    </div>
    <table class="table">
        <thead>
          <tr>
            <th scope="col">#</th>
            <th scope="col">First</th>
            <th scope="col">Last</th>
            <th scope="col">Handle</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <th scope="row">1</th>
            <td>Mark</td>
            <td>Otto</td>
            <td>修改</td>
          </tr>
          <tr>
            <th scope="row">2</th>
            <td>Jacob</td>
            <td>Thornton</td>
            <td>@fat</td>
          </tr>
          <tr>
            <th scope="row">3</th>
            <td>Larry</td>
            <td>the Bird</td>
            <td>@twitter</td>
          </tr>
        </tbody>
      </table>
    
    <section>111111</section>
  </body>
</html>

bling flower

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
bootstrap的使用案例

<!doctype html><html lang="en"> <head> <meta charset="utf-8">  <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <!-- 2.引入bootstrap.
复制链接

扫一扫