无法将HTML连接到外部CSS。

huangapple go评论72阅读模式
英文:

Cant connect html to external css

问题

这是我的头部脚本

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Bootstrap CRUD Data Table for Database with Modal Form</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto|Varela+Round">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">

无法使用<link rel="stylesheet" href="./styles.css">,在我的VScode中没有下划线。

这是我的文件夹结构

无法将HTML连接到外部CSS。

英文:

So im using template that is using internal css, and im going to move the css so it will be external css

this is my head script

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Bootstrap CRUD Data Table for Database with Modal Form</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto|Varela+Round">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css">
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="./styles.css">
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js"></script>

</head>

im unable to use <link rel="stylesheet" href="./styles.css">, and its not underlined in my VScode.

and this is my folder structure

无法将HTML连接到外部CSS。

答案1

得分: 1

一个简单的HTTP服务器会将URL直接映射到文件系统。所以,如果你请求 http://example.com/foo/bar.html,它会在 C:\my webserver/web root/foo/bar.html 查找文件。

你已经将样式表放在一个名为 views 的目录中。这意味着你正在使用某种不那么简单的框架。通常它会使用前端控制器模式执行操作,比如将页面的主要内容放在 views 中,然后用 layout 中的标准头部和尾部包装它。

这样的系统并不是设计来处理放在 views 中的样式表的。你需要弄清楚你的系统如何处理静态文件(通常它们会放在一个名为 staticpublic 的目录中),以及如何确定它们的URL。

你正在使用的框架的文档是一个很好的起点。

英文:

A simple HTTP server will map URLs directly onto the filesystem. So if you ask for http://example.com/foo/bar.html it will look for a file at C:\my webserver/web root/foo/bar.html.

You have placed your stylesheet in a directory named views. This implies you are using some kind of framework which doesn't operate so simply. Typically it will use the front controller pattern and do things like placing the main content of a page in views and then wrapping it with standard headers and footers from a layout.

Systems like this aren't designed to handle stylesheets placed in views. You need to figure out how your system expects static files to be handled (commonly they are placed in a directory called static or public) and how to determine the URL for them.

The documentation for the framework you are using would be a good place to start.

答案2

得分: 0

检查CSS文件的相对路径。
如果您想向上移动一个目录,则使用../,如果您想定位文件在当前目录中,则使用./

英文:

Check the relative path of the css file .
If you want to move one directory up then use ../ or if you want to locate the file in current directory then use ./

huangapple
  • 本文由 发表于 2023年6月12日 13:36:19
  • 转载请务必保留本文链接:https://go.coder-hub.com/76453854.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定