个人中心
gpt4 book ai didi

html - 无法在各自的文件夹中访问网站 css 和 javascript

转载 作者：太空宇宙 更新时间：2023-11-04 02:36:39 24 4
gpt4 key购买 nike

我的学校为每个学生提供一个免费的网站空间。我创建了一个具有以下结构的网站

 - index.html
 - main-site/
  - css/
     - bootstrap.css
     - style.css
  - img/
  - js/
 - help-docs/
 - template/

当我在家里的机器上访问该网站时，一切都正常加载并且 css 已应用于页面。

然后我将该文件夹上传到我的学校网站的根目录。我将默认的 index.html 替换为我的，并将文件夹放在与以前相同的结构中。但问题是，当我从新端点打开页面时，未应用 css。没有加载任何图像，网站看起来只是光秃秃的。

我已经尝试更改文件夹和文件的权限以使其可访问，但这似乎不起作用。我什至将所有内容都更改为 777 并且没有任何区别。我让我的一个 friend 在他的页面上试用我的网站，一切似乎都对他有效。所以在这一点上我不确定问题是什么。

我还应该补充一点，网络服务器是 apache

到目前为止，在我的 .htaccess 文件中，我有以下内容:

DirectoryIndex website.html

我还将 index.html 更改为 website.html，现在使用 website.html 而不是 index.html 访问网站仍然可以正常工作加载 css 或 js 文件。

这是否可以使用 .htaccess 文件来解决？如果是这样，我可以添加什么来完成这项工作？欢迎使用其他解决方案，但需要注意的是我没有 root 访问权限

Index.html

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1" />
  <meta name="description" content="" />
  <meta name="author" content="" />
  <!--[if IE]>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<![endif]-->

  <title>Light Wave Template | DesignBootstrap</title>
  <!-- BOOTSTRAP CORE CSS -->
  <link href="main-site/css/bootstrap.css" rel="stylesheet" />
  <!-- CUSTOM CSS -->
  <link href="main-site/css/style.css" rel="stylesheet" />
  <!-- HTML5 Shiv and Respond.js for IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
</head>

<body>
  <!-- HEADER SECTION START-->
  <section id="header">
    <div class="container">

      <div class="row text-center">

        <div class="col-lg-8 col-lg-offset-2 col-md-8 col-md-offset-2 col-sm-8 col-sm-offset-2 col-xs-12">
          <h1>Light Wave Template </h1>
          <p>
            <strong>6 Style </strong> Versions
          </p>
          <h4>Click on the image to see demos</h4>
        </div>

      </div>
    </div>

  </section>
  <!-- HEADER SECTION END-->
  <!-- PREVIEW SECTION START-->
  <section id="preview">
    <div class="container">
      <div class="row text-center">

        <div class="col-lg-6 col-lg-offset-3 col-md-6 col-md-offset-3 col-sm-8 col-sm-offset-2 col-xs-12 ">
          <h1>SEE DEMOS</h1>
          <h3> <a href="help-docs/index.html" target="_blank">See Document</a></h3>
        </div>

      </div>
      <div class="row">

        <div class="col-lg-6 col-md-6 col-sm-6">
          <div class="preview-wrapper">
            <a href="template/blue.html" target="_blank">
              <img src="main-site/img/previews/1.png" class="img-responsive" alt="" />
              <hr />
              <p>
                Blue Color Version ( With slider background )
              </p>
            </a>
          </div>


        </div>
        <div class="col-lg-6 col-md-6 col-sm-6">
          <div class="preview-wrapper">
            <a href="template/green.html" target="_blank">
              <img src="main-site/img/previews/2.png" class="img-responsive" alt="" />
              <hr />
              <p>
                Green Color Version ( With slider background )
              </p>
            </a>
          </div>


        </div>
        <div class="col-lg-6 col-md-6 col-sm-6">
          <div class="preview-wrapper">
            <a href="template/red.html" target="_blank">
              <img src="main-site/img/previews/3.png" class="img-responsive" alt="" />
              <hr />
              <p>
                Red Color Version ( With slider background )
              </p>
            </a>
          </div>


        </div>
        <div class="col-lg-6 col-md-6 col-sm-6">
          <div class="preview-wrapper">
            <a href="template/yellow.html" target="_blank">
              <img src="main-site/img/previews/4.png" class="img-responsive" alt="" />
              <hr />
              <p>
                Yellow Color Version ( With slider background )
              </p>
            </a>
          </div>


        </div>
        <div class="col-lg-6 col-md-6 col-sm-6">
          <div class="preview-wrapper">
            <a href="template/solid-black.html" target="_blank">
              <img src="main-site/img/previews/5.png" class="img-responsive" alt="" />
              <hr />
              <p>
                Black Background Version ( With solid background )
              </p>
            </a>
          </div>


        </div>
        <div class="col-lg-6 col-md-6 col-sm-6">
          <div class="preview-wrapper">
            <a href="template/solid-red.html" target="_blank">
              <img src="main-site/img/previews/6.png" class="img-responsive" alt="" />
              <hr />
              <p>
                Green Background Version ( With solid background )
              </p>
            </a>
          </div>


        </div>
      </div>

    </div>
  </section>
  <!-- PREVIEW SECTION END-->
  <!-- YES SECTION START-->
  <section id="yes">
    <div class="overlay">
      <div class="container">
        <div class="row text-center">
          <div class="col-lg-12 col-md-12">
            <span class="text-yes">Yes , You heard right !
                            <br />
                            its'free and with documentation</span>
          </div>

        </div>

      </div>
    </div>
  </section>
  <!-- YES SECTION END-->

  <!-- BOTTOM SECTION START-->
  <section id="bottom">
    <div class="container">

      <div class="row text-center">

        <div class="col-md-12">
          <h3>Want Some More ?</h3>
          <h4>EXPLORE : DesignBootstrap.com</h4>
        </div>
      </div>
      <div class="row text-center">

        <div class="col-md-12 ">
        </div>
      </div>
    </div>
  </section>
  <!-- BOTTOM SECTION END-->
  <!-- FOOTER SECTION START-->
  <footer>
    <div class="container">
      <div class="row text-center">
        <div class="col-md-12">
          &copy; 2015 <a href="http://www.designbootstrap.com/" target="_blank">DesignBootstrap.com </a>
        </div>
      </div>
    </div>
  </footer>
  <!-- FOOTER SECTION END-->
  <!-- JAVASCRIPT FILES PLACED AT THE BOTTOM TO REDUCE THE LOADING TIME -->
  <!-- CORE JQUERY SCRIPTS -->
  <script src="main-site/js/jquery-1.11.1.js"></script>
  <!-- BOOTSTRAP SCRIPTS -->
  <script src="main-site/js/bootstrap.js"></script>
</body>

</html>

最佳答案

尝试在主站点之外创建一个新目录并将文件移动到该目录。这可能会解决您遇到的问题。

听起来文件或目录所有权可能有问题，但由于无法看到它，我不太确定。

关于html - 无法在各自的文件夹中访问网站 css 和 javascript，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35543882/

24 4 0
文章推荐： html - 使 div 100% 浏览器高度
文章推荐： node.js - 在 MEAN 堆栈中创建搜索文章功能
文章推荐： node.js - 在流式 HTTP 客户端之间共享 DEFLATE 压缩的数据 block
文章推荐： html - 如何去除 div 标签周围的白边？
太空宇宙
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com