我正在为客户支持创建一个管理页面，我包括了一个花哨的图表来显示主页上的一些信息。这很顺利，但当我向页面添加标签窗格并重新加载时，图表向下增长并导致页面不断滚动，只有在更改标签后才会停止，然后出现，但随着HTML文件的更改，然后重新加载，图表标题（或传说？）也是一团糟，只是显示基本的文本，没有任何格式的CSS中指定的。* 我不能张贴图像的一些原因 *。这是非常恼人的，我想知道什么可能是造成这一点。我会把我正在使用的所有脚本和聊天代码都贴出来。我想知道这是否是由JS文件冲突引起的。
<html>
<head></head>
<body>
<div class="col-lg-4 d-flex flex-grow">
<div class="row ">
<div class="col-md-6 col-lg-12 grid-margin stretch-card">
<div class="card bg-primary card-rounded">
<div class="card-body pb-0">
<h4 class="card-title card-title-dash text-white mb-4">Total Crops</h4>
<div class="row">
<div class="col-sm-4">
<p class="status-summary-ight-white mb-1">For this month</p>
<h2 class="text-info">20</h2>
</div>
<div class="col-sm-8">
<div class="status-summary-chart-wrapper pb-4">
<canvas id="status-summary"></canvas>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-6 col-lg-12 grid-margin stretch-card">
<div class="card card-rounded">
<div class="card-body">
<div class="row">
<div class="col-sm-6">
<div class="d-flex justify-content-between align-items-center mb-2 mb-sm-0">
<div class="circle-progress-width">
<div id="noDisease" class="progressbar-js-circle pr-2"></div>
</div>
<div>
<p class="text-small mb-2">No Diseases</p>
<h4 class="mb-0 fw-bold">70%</h4>
</div>
</div>
</div>
<div class="col-sm-6">
<div class="d-flex justify-content-between align-items-center">
<div class="circle-progress-width">
<div id="withDisease" class="progressbar-js-circle pr-2"></div>
</div>
<div>
<p class="text-small mb-2">With Diseases</p>
<h4 class="mb-0 fw-bold">30%</h4>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<script src="/template/vendors/chart.js/Chart.min.js"></script>
<script src="/template/vendors/bootstrap-datepicker/bootstrap-datepicker.min.js"></script>
<script src="/template/vendors/progressbar.js/progressbar.min.js"></script>
<script src="https://code.jquery.com/jquery-migrate-1.4.1.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="/template/assets/bootstrap/js/bootstrap.min.js"></script>
<script src="/template/assets/bootstrap/css/bootstrap.min.css"></script>
<script src="/template/js/jquery.cookie.js" type="text/javascript"></script>
<script src="/template/js/dashboard.js"></script>
<script src="/template/js/Chart.roundedBarCharts.js"></script>
</body>
1条答案
按热度按时间mbzjlibv1#
我可以观察到，您在脚本标记中使用了
bootstrapcss文件，如下所示-我们不能在脚本标记内使用样式表，要加载样式表/ CSS，我们需要link标记作为并在head标记内使用它-
请使用这个作为样式表，并使用
link标记相同。我希望它会开始工作。如果我能进一步帮助你，请告诉我。谢谢。