首页 > 代码库 > jqm的多列布局demo,html5的多列布局demo,多列布局的详细讲解,html5开发实例详解
jqm的多列布局demo,html5的多列布局demo,多列布局的详细讲解,html5开发实例详解
由于移动设备屏幕宽度较小,所以一般不建议使用多列布局。但有时你可能需要并排放置一些元素(如按钮之类的)。
jQuery Mobile通过约定的类名ui-grid来提供了一种基于css的多列布局方法。共提供了五种布局方式,分别是:ui-gird-solo:单列布局,ui-gird-a:双列布局,ui-gird-b:三列布局,ui-gird-c:四列布局,ui-gird-d:五列布局。布局网格总宽度100%,完全不可见(无边框无背景),没有任何内边距或外边距,不会对网格中的内容产生任何干扰。
今天我们来看看jqm的多列布局demo:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>jQuery Mobile页面跳转切换的几种方式</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> <meta http-equiv="description" content="this is my page"> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <meta name="viewport" content="width=device-width"/> <!--<link rel="stylesheet" href=http://www.mamicode.com/"http://code.jquery.com/mobile/1.4.2/jquery.mobile-1.4.2.min.css">>看看运行效果截图:
好了,就到这里了,欢迎大家关注我的博客!资料下载地址:http://download.csdn.net/detail/xmt1139057136/7548491
点击下载
如有不懂,请加qq群:135430763,共同学习!
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。