吴裕雄 Bootstrap 前端框架开发——Bootstrap 网格系统实例:列排序
2024-10-08 11:23:54
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Bootstrap 实例 - 列排序</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body> <div class="container"> <h1>Hello, world!</h1> <div class="row">
<p>排序前</p>
<div class="col-md-4" style="background-color: #dedef8;
box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;">
我在左边
</div>
<div class="col-md-8" style="background-color: #dedef8;
box-shadow: inset 1px -1px 1px #444, inset -1px 1px 1px #444;">
我在右边
</div>
</div><br>
<div class="row">
<p>排序后</p>
<div class="col-md-4 col-md-push-8"
style="background-color: #dedef8;
box-shadow: inset 1px -1px 1px #444,
inset -1px 1px 1px #444;">
我在左边
</div>
<div class="col-md-8 col-md-pull-4"
style="background-color: #dedef8;
box-shadow: inset 1px -1px 1px #444,
inset -1px 1px 1px #444;">
我在右边
</div>
</div> </div> </body>
</html>
最新文章
- Autofac - 程序集扫描
- 学习笔记:HSB、HSL
- 初入Cocos2d-x 2.2
- SAP本地文件策略(导EXCEL选择拒绝后处理)
- Android再次激活Activity时触发事件用于列表重新读取载入
- leetcode题1Two sum 练习
- c语言学习之基础知识点介绍(十六):文件操作
- CMake高速入门
- 从头开始学JavaScript (十三)——Date类型
- vue-webpack-boilerplate分析
- Servlet学习记录4
- (二)JavaScript 输出
- JSP Servlet javaben
- C++基础知识:类的静态成员
- 传智播客实战taotao项目页面菜单栏Tree的Java实现方法
- Ubuntu16.04下安装CUDA8.0和tensorflow
- Seafile 文件访问日志时间不一致问题
- 结对编程--fault,error,failure
- 使用.Net Core发布可从外部访问的网站
- XSS盗COOKIE
热门文章
- 使用Quartz Job 简单的做一个定时服务
- ubuntu的dpkg命令安装和卸载软件
- 生成SSH密钥过程
- apache的下载
- The Preliminary Contest for ICPC Asia Shanghai 2019 B Light bulbs (离散的差分)
- STM32F030 启用内部晶振并配置系统时钟为48M
- 【PAT甲级】1080 Graduate Admission (30 分)
- PCC值average pearson correlation coefficient计算方法
- TakeColor下载及调节鼠标指针不一致的问题
- python 创建虚拟环境:bat实现一键