Bootstrap 流式布局

Bootstrap 流式布局流式布局同理,将Bootstrap的流式栅格放到class="container-fluid"的流式容器中,即可创建流式布局。流式布局将填满整个视口宽度。如:<divclass="container-fluid"> <divclass="row-fluid">   <divclass="span2">     <!–

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全家桶1年46,售后保障稳定

同理,将Bootstrap的流式栅格放到 class=”container-fluid” 的流式容器中,即可创建流式布局。流式布局将填满整个视口宽度。如:


Jetbrains全家桶1年46,售后保障稳定

  1. <div class="container-fluid">
  2.   <div class="row-fluid">
  3.     <div class="span2">
  4.       <!--Sidebar content-->
  5.     </div>
  6.     <div class="span10">
  7.       <!--Body content-->
  8.     </div>
  9.   </div>
  10. </div>

布局效果如图 2‑9所示:

Bootstrap流式布局图2-9 Bootstrap流式布局

关于作者

歪脖先生,十五年以上软件开发经验,酷爱Web开发,精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等,著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》,并全部在 GitHub 上开源。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/206807.html原文链接:https://javaforall.net

赞 (0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • AutoScaling 目标追踪伸缩规则概述「建议收藏」

    AutoScaling 目标追踪伸缩规则概述「建议收藏」AutoScaling 目标追踪伸缩规则概述

    2022年4月21日
  • php spreadsheet导入

    php spreadsheet导入/***导入*/publicfunctionimport(){//composer安装//composerrequirephpoffice/phpspreadsheet$upload_file=$_FILES[‘file’][‘tmp_name’];//文件类型//$ext=strtolower(pathinfo($_FILES[‘file…

    2022年9月2日
  • File类createNewFile与createTempFile的区别[通俗易懂]

    自:http://www.cnblogs.com/huangyibo/p/3667714.html最近,在看代码时看到了一个方法,File.createTempFile(),由此联想到File.createNewFile()方法,一时间不知道两者到底有什么区别,感觉都是创建新文件嘛,后来查看api文档介绍,并经过自己动手试验,终于有了一个较为清楚地认识。 1.File的crea…

    2022年4月11日
  • owasp靶机使用教程_br软件使用教程

    owasp靶机使用教程_br软件使用教程A1注入htmlinjection:low:最基础的xss注入:xss测试1.get跳转点击这儿领红包获取cookie:)xss平台利用:'”>xss平台:medium:此时直接注入已经不能执行了由于是get注入,考虑进行url编码:clickit%3c%61%20%68%72%65%66%3d%22%68%74%74%70%73%3a%2f%2…

    2022年9月24日
  • qtcpsocket编程_qtcpsocket判断连接状态

    qtcpsocket编程_qtcpsocket判断连接状态QTcpSocket和QTcpServer类实现了Qt的Tcp客户端和服务器。 tcp是一个流式协议。对于应用程序来说,数据是一个很长的流,有点像一个巨大的文件。 搞成此的协议建立在面向块的tcp协议(Block-oriented)或面向行(Line-oriented)的tcp协议上。 面向块的tcp协议,数据被当作一个2进制的块来传输。没每一个块被当作一个定义了大小的,后面

    2022年9月8日
  • zabbix监控redis信息

    zabbix监控redis信息了解Redis的info要获得Redis的当前情况,使用info命令即可。具体用法:redis-cli-h127.0.0.1-p6379-aredis_passwdinfo[参数]。针对不同的参数就会看到具体的数字,如果没有带参数,那么就会把默认情况写出来,如果带上all参数,那么就会把所有情况都写出来。比如:redis-cli-h127.0.0.1-p6379-aredis_passwdinfoserver,就会看到redis关于server的一些数据,如下:可以看

    2022年5月3日

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号