bootstrap学习笔记-布局-响应试布局

原创
2013/06/15 20:45
阅读数 492
<!doctype html>
<html>
<head>
<meta charset="gbk">
<title>布局学习</title>
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link href="../css/bootstrap.min.css" rel="stylesheet">
<link href="../css/bootstrap-responsive.min.css" rel="stylesheet">
<!--适应不同分辨率的设置-->
</head>
<!--
	定义的内容会在对应的设备上显示
	.visible-phone;手机
	.visible-table;平板
	.visible-desktop;电脑
	定义的内容会在对应的设备上不显示	
	.hidden-phone;手机
	.hidden-table;平板
	.hidden-desktop;电脑
	
-->
<body class="oontainer">
<h1 class="page-header">响应时设计<small>简单示例</small></h1>
<div class="row">
<div class="page-header clearfix">
	<div class="span4">智能手机</div>
	<div class="span4 visible-desktop" >平板电脑</div>
	<div class="span4 hidden-desktop" >桌面电脑</div>
</div>
</div>
</body>
</html>
展开阅读全文
打赏
0
1 收藏
分享
加载中
更多评论
打赏
0 评论
1 收藏
0
分享
返回顶部
顶部