首页 > 解决方案 > 如何将页边距固定在左侧?

问题描述

如何修复页面左侧空白边距,所有模板都出现此问题,奇怪的是,我没有更改模板的CSS或索引页面,它正在工作,突然它改变了。

<head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>Admin</title>
    <!-- plugins:css -->
    <base href="/">
    <link rel="stylesheet" href="vendors/iconfonts/mdi/css/materialdesignicons.min.css">
    <link rel="stylesheet" href="vendors/css/vendor.bundle.base.css">
    <link rel="stylesheet" href="vendors/css/vendor.bundle.addons.css">

    <link rel="stylesheet" href="css/style.css">
    <link rel="stylesheet" href="css/bootstrap.min.css">

    <link rel="stylesheet" href="css/sweetalert.min.css">
    <link rel="stylesheet" href="css/font-awesome.min.css">
    <link rel="stylesheet" href="css/bootstrap-glyphicons.css">
    <!-- endinject -->
    <link rel="shortcut icon" href="images/favicon.png"/>
</head>

在这里我导入 JS 文件

<script src="vendors/js/vendor.bundle.base.js"></script>
<script src="vendors/js/vendor.bundle.addons.js"></script>
<script src="js/dashboard.js"></script>
<script language="javascript" type="text/javascript" src="js/jquery3.3.1.js"></script>
    <script language="javascript" type="text/javascript" src="js/bootstrap.min.js"></script>
    <script language="javascript" type="text/javascript" src="js/sweetalert2.js"></script>
    <script language="javascript" type="text/javascript" src="js/association.js"></script>
    <script language="javascript" type="text/javascript" src="js/app.js"></script>

这是我的看法

这就是问题所在 在此处输入图像描述

请问我必须在哪里以及如何添加CSS?

标签: htmlcss

解决方案


您通常可以使用 Chrome 的 DevTools 自己找到答案。

  1. 打开 DevTools(F12 或右键单击页面并选择Inspect Element

  2. 单击指向框内的箭头左上角的图标

  3. 将鼠标移到有问题的区域

  4. 点击

  5. 在 DevTools 窗口中,您将看到左侧的 HTML,以及右侧垂直窗格中突出显示的 HTML 标记的 CSS。您可以在这里尝试调整不同的 CSS 设置并实时观察变化。(注意:这只是一个测试区,不会对您的网页进行任何更改。当您发现神奇之处时,请更新您的网页代码。)

使用 Chrome DevTools 进行更好的 CSS 编码

如何使用 Chrome DevTools 进行调试


推荐阅读