From bbf8992414df6cd3e4ad64a9dfb2fdb6c5a0e2c8 Mon Sep 17 00:00:00 2001
From: star0527 <5506631@qq.com>
Date: 星期四, 20 七月 2023 09:35:48 +0800
Subject: [PATCH] 修改移动端样式
---
mobile/road.html | 135 +++++++++-----------------------------------
1 files changed, 29 insertions(+), 106 deletions(-)
diff --git a/mobile/road.html b/mobile/road.html
index b7ee2b5..e7b2151 100644
--- a/mobile/road.html
+++ b/mobile/road.html
@@ -22,114 +22,17 @@
<!--绗笁鏂筶ib-->
<script type="text/javascript" src="../lib/include-lib.js?time=20210803" libpath="../lib/" include="jquery"></script>
- <link href="../css/style.css?time=20210803" rel="stylesheet" />
-
- <style>
- * {
- padding: 0;
- margin: 0;
- box-sizing: border-box;
- }
-
- ul,
- li {
- list-style: none;
- }
- .header{
- position: fixed;
- display: flex;
- height: 50px;
- width: 100%;
- padding: 10px;
- background: #0d47a1;
- color: #fff;
- font-size: 16px;
- box-shadow: 0 2px 4px rgba(83, 116, 167, 0.2);
- vertical-align: middle;
- }
- .header > img{
- width: 30px;
- height: 30px;
- padding: 2px;
- margin-right: 6px;
- background: #fff;
- border-radius: 2px;
- }
- .header > .title{
- flex: 1;
- line-height: 30px;
- }
- .header > .user{
- font-size: 12px;
- line-height: 30px;
- text-align: right;
- }
-
- .footbar {
- height: 50px;
- background: #fff;
- box-shadow: 0 -1px 6px rgba(13, 71, 161, 0.25);
- z-index: 9999999999999;
- position: fixed;
- left: 0;
- right: 0;
- bottom: 0;
- }
-
- .footbar ul {
- display: flex;
- overflow: hidden;
- margin: 7px 12px;
- border-radius: 3px;
- }
-
- .footbar ul li {
- flex: 1;
- font-size: 14px;
- line-height: 34px;
- color: #333;
- text-align: center;
- border: 1px solid rgba(83, 116, 167, 0.2);
- }
-
- .footbar ul li.active {
- font-weight: 500;
- color: #e0f7fa;
- background: #0d47a1;
- border: 1px solid 0d47a1;
- }
-
- .hidden {
- display: none;
- }
-
- .map-panel {
- margin-top: 50px;
- height: calc(100vh - 100px);
- background: #fff;
- overflow: hidden;
- }
-
- .map-panel-item {
- width: 100%;
- height: 100%;
- }
- iframe{
- width: 100%;
- height: 100%;
- border: 0;
- }
- </style>
+ <link href="css/style.css" rel="stylesheet" />
</head>
<body>
- <div class="header">
- <img src="../img/logo.png">
- <div class="title">涓婃捣甯傞亾璺氦閫氱幆澧冪洃娴嬪钩鍙�</div>
- <div class="user"><span id="name_"></span></div>
- </div>
- <div class="map-panel" id="a1">
+ <div class="page">
+ <div class="header">
+ <div class="title">鐩戞帶鎬昏</div>
+ </div>
+
+ <div class="main map-panel" id="a1">
<!--閬撹矾鏌ヨ 寮�濮�-->
<div class="map-panel-item">
<iframe src="road_search.html"></iframe>
@@ -144,14 +47,34 @@
</div>
<!--footbar 寮�濮�-->
- <div class="footbar">
+ <!-- <div class="footbar">
<ul btn='btn' data-target="#a1">
<li class="active"><i class="fa fa-search"></i> 閬撹矾鏌ヨ</li>
<li><i class="fa fa-road"></i> 閬撹矾灞曠ず</li>
</ul>
- </div>
+ </div> -->
<!--footbar 缁撴潫-->
+ <!--tabbar 寮�濮�-->
+ <!-- <ul class="tabbar">
+ <li class="active"><i class="fa fa-search"></i> 閬撹矾鏌ヨ</li>
+ <li><i class="fa fa-road"></i> 閬撹矾灞曠ず</li>
+ </ul> -->
+ <div class="footbar">
+ <ul>
+ <li>
+ <a href="cars.html"><img src="img/cars.png"><span>杞﹁締鏄剧ず</span></a>
+ </li>
+ <li>
+ <a href="road.html" class="active"><img src="img/monitor_active.png"><span>鐩戞帶鎬昏</span></a>
+ </li>
+ <li>
+ <a href="data.html"><img src="img/data.png"><span>鏁版嵁鎬昏</span></a>
+ </li>
+ </ul>
+ </div>
+ <!--tabtbar 缁撴潫-->
+</div>
<script>
$.fn.$btnId = function () {
$(this).children().click(function () {
--
Gitblit v1.9.1