Bootstrap栅格系统 案例

简介: Bootstrap栅格系统 案例

5.png


第一行和第四行要记住


代码


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./bootstrap-3.4.1-dist/css/bootstrap.min.css">
    <style>
        .container div {
            height: 50px;
            background-color: yellowgreen;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="col-lg-3 col-md-6">1</div>
        <div class="col-lg-3 col-md-6">2</div>
        <div class="col-lg-3 col-md-6">3</div>
        <div class="col-lg-3 col-md-6">4</div>
    </div>
</body>
</html>


注意


<link rel="stylesheet" href="./bootstrap-3.4.1-dist/css/bootstrap.min.css">


注意不要引入错误



相关文章
|
3月前
|
机器学习/深度学习 存储 算法
基于Flask+Bootstrap+机器学习的世界杯比赛预测系统
基于Flask+Bootstrap+机器学习的世界杯比赛预测系统
58 0
|
4月前
|
编解码 移动开发 前端开发
【Bootstrap】<前端框架>Bootstrap布局容器&栅格网格系统
【1月更文挑战第17天】【Bootstrap】<前端框架>Bootstrap布局容器&栅格网格系统
|
3月前
|
机器学习/深度学习 数据采集 算法
基于Flask+Bootstrap+机器学习的南昌市租房价格预测系统(上)
基于Flask+Bootstrap+机器学习的南昌市租房价格预测系统
55 0
|
7月前
|
前端开发
前端基础 - Bootstrap简单案例
前端基础 - Bootstrap简单案例
41 0
|
10天前
|
前端开发 容器
Bootstrap 5 保姆级教程(一):容器 & 网格系统
Bootstrap 5 保姆级教程(一):容器 & 网格系统
N..
|
2月前
|
开发框架 前端开发 容器
Bootstrap栅格系统
Bootstrap栅格系统
N..
12 0
|
2月前
|
前端开发
bootstrap组件的案例代码
bootstrap组件的案例代码
9 0
|
2月前
|
前端开发
bootstrap样式代码案例
bootstrap样式代码案例
11 0
|
3月前
|
机器学习/深度学习 数据可视化 Python
基于Flask+Bootstrap+机器学习的南昌市租房价格预测系统(下)
基于Flask+Bootstrap+机器学习的南昌市租房价格预测系统
51 0
|
4月前
|
前端开发 JavaScript
BootStrap使用笔记+案例(下)
BootStrap使用笔记+案例
22 0