如何在桌面(离线)和网站(在线)上查看css样式?



我有一个style.css和一个html文件。 当我将它们上传到服务器时,我看到了我想要的样式的标题,但在桌面上我没有。

我的两个文件都在桌面上

<head>我的 html 文件中有这一行:

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

当我在桌面上脱机工作时,可以执行哪些操作来连接文件并查看应用的样式? 也在我的网站上在线

  • 我想添加我刚刚删除了/并且它在我的桌面上离线工作(只是 href="style.css"(但不能在线 - 但我希望能够在线和离线----和在线看到它不在同一个文件中

**编辑:现在我看到,如果我把我的特定网站地址放在一起,那么两者都有效 - 而不是在线和离线:

但是,如果我想更改我的网站地址,则很难在每个页面上更改,这就是为什么我希望它是:href="/style.css而不是网站地址

如果您在没有网络服务器的情况下在本地工作,则需要像这样链接您的 css 文件:

<!-- Windows -->
<link rel="stylesheet" href="C:PathtoFilemain.css">
<!-- Linux & Stuff -->
<link rel="stylesheet" href="/path/to/file/main.css">

此外,您还可以使用文件的相对路径:

<!-- if it's in the same folder -->
<link rel="stylesheet" href="main.css">
<!-- if it's in the css folder -->
<link rel="stylesheet" href="css/main.css">
<!-- if it's in the parent folder -->
<link rel="stylesheet" href="../main.css">

您的问题仍然不清楚,但一般来说,您的问题似乎基于样式表与HTML文件的链接,以查看个人笔记本电脑和服务器上的代码结果。这样做的最佳实践是维护一个保持项目井井有条的文件结构,例如,有一个名为"main"的文件夹,这是我的项目文件夹,它进一步包含您的子文件夹,如 CSS 和 js,在这些文件夹中,您应该分别保留您的 CSS 和 js 文件。 一个简单的项目文件结构是,


|
|-css |-style.css
|-js

        |-script.js
|-file.html

如果您按照文件结构链接文件,则不会出错,无论您是在个人桌面上还是在服务器上都无关紧要。

我理解的一件事是,当您在本地工作时,桌面上有html文件和css文件。首先,我建议您创建一个新文件夹并复制所有相关文件,无论是该文件夹中的html文件,css文件还是js文件。这是将所有项目文件封装在一个文件夹中的更好方法。 继续讨论 css 问题 - 您说当您删除/时它可以工作。它之所以有效,是因为由于您的文件都在桌面上,因此它们位于相同的目录结构上。

足以澄清我希望您按照以下步骤操作:-

  1. 首先创建一个文件夹,并在其中复制您的html文件,css文件和js文件。让我们将文件夹命名为网站。
  2. 在网站文件夹中创建一个名为 css 的文件夹。复制该 css 文件夹中的所有 css 文件。
  3. 在你的html文件中,在写<link rel="stylesheet" href="css/style.css">内,前提是css文件的名称是style.css并且您希望将此特定文件包含在html中。

关于您的在线问题,我无法理解。如果你再澄清一点,我可能会帮忙。

您的文件在桌面和服务器上应具有相同的相对路径,以便您可以对两者使用相同的相对路径。相对路径基于 HTML 文件在两者中的位置。

如果您的桌面上有包含 2 个文件的文件夹:

  • 索引.html
  • 风格.css

在 index.html 中,您将使用<link rel="stylesheet" href="style.css">引用样式表

如果您的桌面上有 1 个文件和 1 个包含文件的文件夹:

  • 索引.html
  • css/(包含文件: style.css(

在 index.html 中,您将使用<link rel="stylesheet" href="css/style.css">引用样式表

既然您说<link rel="stylesheet" href="style.css">在您的服务器上正常工作,这意味着您的 HTML 和 CSS 文件包含在同一个父文件夹中。在您的本地,您需要确保也是如此。该父文件夹可以位于任何地方 - 文档,桌面,随机子文件夹 - 但只要它包含该HTML文件和该CSS文件(并且它们都没有嵌套在另一个包含的文件夹中(,该<link rel="stylesheet" href="style.css">将同时适用于两者。

注意:您可以更改服务器和/或桌面的文件夹结构 - 但相对路径必须匹配,以便您的相对链接适用于两者。

这样给出

<link rel="stylesheet" href="style.css">

最新更新