gpt4 book ai didi

javascript - Firebase/AngularJS Bootstrap 应用程序无法适应移动屏幕

转载 作者:行者123 更新时间:2023-12-03 02:45:45 24 4
gpt4 key购买 nike

我是 firebase 和 Angular 的新手。我只是尝试构建一个应用程序,但似乎有些东西无法与 Bootstrap 网格一起使用。当我缩小窗口时,应用程序会进行调整。但是,当我尝试使用控制台和移动设备尺寸时,该应用程序不会像普通 Bootstrap 网站那样调整到屏幕尺寸。您可以亲自看看:

也许我只是将脚本对齐为假......我也尝试从 jquery 切换到 UI Bootstrap,但它也不起作用。

    <!DOCTYPE html>
<html ng-app="nipfct">
<head>
<meta charset="utf-8">
<base href="/">


<title>Nobody is perfect</title>

<link rel="stylesheet" href="theme/css/bootstrap.css" media="screen" />
<link rel="stylesheet" href="theme/css/styles.css" type="text/css" media="screen" />

<!-- update the version number as needed -->
<script defer src="/__/firebase/4.8.1/firebase-app.js"></script>
<!-- include only the Firebase features as you need -->
<script defer src="/__/firebase/4.8.1/firebase-auth.js"></script>
<script defer src="/__/firebase/4.8.1/firebase-database.js"></script>
<script defer src="/__/firebase/4.8.1/firebase-messaging.js"></script>
<script defer src="/__/firebase/4.8.1/firebase-storage.js"></script>
<!-- initialize the SDK after all desired features are loaded -->
<script defer src="/__/firebase/init.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.1/angular-route.js"></script>
<script src="https://www.gstatic.com/firebasejs/3.6.6/firebase.js"></script>
<script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script>
<!--<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha256-k2WSCIexGzOj3Euiig+TlR8gA0EmPjuc79OEeY5L45g="crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>-->
<script src="theme/js/ui-bootstrap-tpls-2.5.0.min.js"></script>
<script src="theme/js/scripts.js"></script>


</head>
<body ng-controller="mainController">

脚本.js

    var nipfctView = angular.module('nipfct', ['ngRoute', 'firebase', 'ui.bootstrap']);


nipfctView.config(function($routeProvider, $locationProvider) {
$routeProvider


$routeProvider
.when('/', {
templateUrl : 'pages/login.html',
controller : 'mainController'
})

.when('/home', {
templateUrl : 'pages/home.html',
controller : 'mainController'
})

.when('/settings', {
templateUrl : 'pages/settings.html',
controller : 'mainController'
})

$locationProvider.html5Mode(true);

});

nipfctView.controller('mainController', function($scope) {

});

最佳答案

尝试在您的 head 部分添加此元标记

<meta name="viewport" content="width=device-width, initial-scale=1.0"> 

关于javascript - Firebase/AngularJS Bootstrap 应用程序无法适应移动屏幕,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48102180/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com