我是新来的。如何导入css文件和javascript文件,什么是一个好的文件结构,当新的web开发学习?
下面是使用CSS和JS的HTML压缩框:
<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<title>Page Title</title>
<link rel="stylesheet" href="linktoyourstylesheet.css">
<script type="text/javascript" src="linktoyourscript.js"></script>
<body>
Main Content Here
</body>
</html>
在我的索引文件的同一层,我有一个资产文件夹,其中包括JS和CSS文件夹。
使用<链接在对于CSS和把它放在HTML的头部标签是首选,这里href有CSS文件的路径和名称:>
<link rel="stylesheet" href="/file.css">
使用<脚本在对于javascript,把它放在body标签的底部是首选的,这里SRC有js文件的路径和名称:>
<script type="text/javascript" src="file.js"></script>
文件结构良好
至于良好的文件结构:包括你的JS和CSS文件在assets/
文件夹和/或在他们自己的单独文件夹js/
和css/
。下面是一个例子:
index.html
otherpage.html
assets/
js/
main.js
funcs.js
css/
global.css
darkmode.css
为了更简单,您可以尝试
index.html
otherpage.html
js/
main.js
funcs.js
css/
global.css
darkmode.css
或
index.html
otherpage.html
assets/
main.js
funcs.js
global.css
darkmode.css
这完全取决于你,取决于你的项目有多复杂。如果您只有3个文件(HTML、CSS和JS),您可能根本不需要任何文件夹结构。如果你有20个……你应该确保一切都安排妥当。您也可以对图像img/
、字体font/
和其他东西执行此操作。
包括CSS
要在HTML中包含CSS文件,请在head
标记中插入以下内容。
<link rel="stylesheet" href="./assets/css/global.css"/>
还需要注意,您需要将href
属性更改为CSS文件的实际文件路径。
包括JavaScript
对于JavaScript,它甚至更简单。将此标签包含在body
标签的末尾。
<script src="./assets/js/main.js"></script>
必须同时包含开始和结束标记。同样,将文件路径更改为您的JS文件。