LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

使用bootstrap做响应式布局

freeflydom
2024年7月19日 8:34 本文热度 599

 

1、引入bootstrap.min.css

选用于生产环境下载后,引入css。

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

 

2、使用bootstrap类布局

BootStrap3默认将网页分成12等份,页面宽度缩小时自动折行。

如以下代码,使用了bootstrap的class类container和col-*。

col-lg-3这里意思是大屏时每个div占用3份,4个div刚好把12份占满,中屏时使用col-md-6,每个div占用6份,前两个div把12份占满了,后两个div另起一行占满。

<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>

小屏:

 中屏:

 

大屏:

 



该文章在 2024/7/19 9:05:27 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved