热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

bootstrap响应式表格实例详解

这篇文章主要为大家详细介绍了bootstrap响应式表格的实例代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机,现在就bootstrap的响应式举一个例子:

如上图所示,要实现该表格在手机等移动端上只显示代号、名称、和价格,其他以查看详情的方式显示(也就是下图:)

首先,先实现在移动端能由左图到右图的转换:

代码如下:

  
  
  
  
  
   
  
   
  
  
  query($sql);   
   foreach($arr as $v){
 
     echo "
     ";  
     //为什么id='xq'不行?不要用id,id是唯一的,此处有多个查看详情。。。。记住了!!!! 
   } 
 ?>
 
代号 名称 价格 操作
{$v[0]} {$v[1]} {$v[2]}

其次:实现点击查看详情出现模态框



 

处理页面:chuli.php

<&#63;php
$code=$_POST["code"];
require "../DB.class.php";
$db=new DB();
$sql = "select * from buyfruits where ids='{$code}'";
$arr = $db->strquery($sql);
echo $arr;
&#63;>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。


推荐阅读
author-avatar
KING逊咖
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有