2016 医疗项目 Bootstrap 自适应页面布局(1)
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>home</title>
<!--[if lt IE 9]>
<meta http-equiv="refresh" content="0;ie.html" />
<![endif]-->
<!--Bootstrap 内核 css 开始-->
<link href="Bootstrap/css/bootstrap-theme.css" rel="stylesheet" />
<link href="Bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<!--Bootstrap 内核 css 结束-->
<!--Bootstrap 插件 css 开始-->
<link href="Bootstrap/css/plugins/bootstrap-jquery-confirm/jquery-confirm.css" rel="stylesheet" />
<!--Bootstrap 插件 css 结束--> </head>
<body>
<div class="container">
<h1>系统统计. <small>患者、医生...</small></h1> <div class="row">
<div class="col-xs-6">
<h2>患者</h2>
</div>
<div class="col-xs-6">
<h2>详情</h2>
<p>目前接受治疗的人数 <a class="btn btn-default" href="#">【100】</a></p>
<p>三个月内停治的人数 <a class="btn btn-default" href="#">【100】 </a></p>
<p>超过一个月未参与治疗人数<a class="btn btn-default" href="#">【100】 </a></p> </div> </div>
<div class="row">
<div class="col-xs-6">
<h2>医生</h2>
</div>
<div class="col-xs-6">
<h2>详情</h2>
<p>合作医生的人数 <a class="btn btn-default" href="#">【100】</a></p>
<p>合作后又停止合作的医生人数 <a class="btn btn-default" href="#">【100】</a></p>
<p>超过一个月未参与治疗人数<a class="btn btn-default" href="#">【100】</a></p> </div> </div> <!--Bootstrap 内核 js 开始-->
<script src="jQuery/jquery-2.1.1.js"></script>
<script src="Bootstrap/js/bootstrap.min.js"></script>
<!--Bootstrap 内核 js 结束-->
<!--Bootstrap 插件 js 开始-->
<script src="Bootstrap/js/plugins/bootstrap-jquery-confirm/jquery-confirm.js"></script>
<!--Bootstrap 插件 js 结束-->
</body>
</html>

2016 医疗项目 Bootstrap 自适应页面布局(1)的更多相关文章
- jQuery实现等比例缩放大图片让大图片自适应页面布局
通常我们处理缩略图是使用后台代码(PHP..net.Java等)根据大图片生成一定尺寸的缩略图,来供前台页面调用,当然也有使用前台javascript脚本将加载后的大图强行缩放,变成所谓的缩略图,这种 ...
- 使用rem进行自适应页面布局
设计师给到我们前端的设计稿一般是按照iphone6屏幕(iphone6 两倍屏 设备 分辨率(物理尺寸) 屏幕宽高 PPI 状态栏高度 导航栏高度 标签栏高度 iPhone6 750×1334 px ...
- 32Flutter仿京东商城项目 用户中心页面布局
import 'package:flutter/material.dart'; import 'package:flutter_jdshop/services/ScreenAdapter.dart'; ...
- Web前端代码规范与页面布局
一. 规范目的: 为提高工作效率,便于后台人员添加功能及前端后期优化维护,输出高质量的文档,在网站建设中,使结构更加清晰,代码简明有序,有一个更好的前端架构,有利于SEO优化. 二. ...
- 前后端不分离的springboot项目问题:页面框架问题
前言:最近自己想搞一个以springboot开发的web项目,由于页面布局问题,在前期开发的时候没有太注意,每天写一点现在开发到一半出现了一个大问题. 1.先说说整个网站框架搭建问题:(整个项目前后端 ...
- 利用层的table-row、table-cell属性进行页面布局
利用层的table-row.table-cell属性可以进行等高.宽度自适应页面布局,这是参看了<我所知道的几种display:table-cell的应用>及<基于display:t ...
- 自适应XAML布局经验总结 (一)原则和页面结构设计
XAML布局回顾 Grid和StackPanel是核心布局,尤其以Grid最为重要. Grid是网格布局,XAML的设计者有可能参考了Html里的Table设计了Grid布局,但进行了改进.Html中 ...
- bootstrap+css进行页面布局
效果 用到了bootstrap中的表格css.圆形css.以及上一页下一页css. 布局页面,填充数据,实现js动态效果(比如点击下一页,上一页),逐步完善. 不仅仅要会使用bootstrap中的样式 ...
- bootstrap页面布局
首先,我们必须明确,在这四种角色登录网站,看到页面是不同,这里不仅涉及到后端的权限控制,还涉及到前端页面的布局,区分好这些角色看的东西哪些是相同的,哪些又是不同的呢,这个必须在这里想明白,所以要做好页 ...
随机推荐
- React Native学习-将 'screen', 'window' or a view生成图片
https://github.com/facebook/react-native/commit/ac12f986899d8520527684438f76299675dc0daa 这是react-nat ...
- WPF全球化与本地化 (二)
Visual Baml Visual Locbaml is a free and open-source software to simplify the task of WPF applicatio ...
- 判断当前是否运行于Design Mode
在使用Visual Studio设计XAML时,设计器运行在[设计时]状态.VS在内部运行这些代码,帮你把界面的类真实效果展示出来.一般情况下也不会有什么问题,但是当代码中存在外部资源时,XAML可能 ...
- 看完final的感受
今天没课,(其实是有体育课的,去打了一会球就跑路了...)就在宿舍看world final ; 我去,老毛子真是好厉害,看的我目瞪口呆,哈喇子直流; 上交的大神好厉害,本来还以为上交要夺冠的,最后罚时 ...
- Codevs 1287 矩阵乘法&&Noi.cn 09:矩阵乘法(矩阵乘法练手题)
1287 矩阵乘法 时间限制: 1 s 空间限制: 128000 KB 题目等级 : 黄金 Gold 题解 查看运行结果 题目描述 Description 小明最近在为线性代数而头疼, ...
- Sharepoint 高级筛选
先看看效果吧.............. 默认情况下:不做任何筛选. 添加一个筛选条件: 条件:如果是int类型那么可以有> < = 等 如果是string的话那么就没有这么多条件,当然这 ...
- ASP.NET缓存全解析4:应用程序数据缓存 转自网络原文作者李天平
System.Web.Caching 命名空间提供用于缓存服务器上常用数据的类.此命名空间包括 Cache 类,该类是一个字典,您可以在其中存储任意数据对象,如哈希表和数据集.它还为这些对象提供了失效 ...
- hdu 1222 Wolf and Rabbit
Problem Description There is a hill with n holes around. The holes are signed from 0 to n-1. A rabbi ...
- Movie importing requires quicktime
在Unity中使用MovieTexture播放视频会碰到movie importing requires quicktime的错误,解决方法如下: 1.关闭Unity安装QuickTime播放器,打开 ...
- 配置PostgreSQL Streaming Replication集群
运行环境: Primary: 192.168.0.11 Standby: 192.168.0.21, 192.168.0.22 OS: CentOS 6.2 PostgreSQL: 9.1.2 版本以 ...