html怎么引入外部css文件

上周 我的朋友问我如何将外部 CSS 添加到 HTML 中。

基本过程是添加<link>标签。
将其放入 <head> 中。

<link rel="stylesheet" href="style.css">
rel="stylesheet" 表示这是一个样式表。
href 写入 CSS 文件的路径。

路径有多种类型。
绝对路径。
例如 https://example.com/css/style.css。

相对路径。
使用./当前目录。
./css/style.css。
使用../顶级目录。
../样式/main.css。

相对路径根。
从网站的根目录开始。
/assets/css/global.css。

建议将<head>放在最后。
把文件名写清楚。
例如main.css。

文件可以合并。
或者使用媒体查询。
例如 <link rel="stylesheet" href="print.css" media="print">。
仅在打印时下载。

示例代码如下所示。
<link rel="stylesheet" href="/styles/main.css"> <link rel="stylesheet" href="./css/theme.css"> <link rel="stylesheet" href="https://cdn.example.com/lib.css">
注意路径正确。
否则会是4 04 用你的浏览器检查一下。

服务器配置也必须正确。
MIME 类型必须设置为 text/css。

就是这样。
由你决定。

怎么在html中调用css文件?

嘿兄弟,我记得当我第一次学习HTML和CSS时,真的很困惑。
当时我使用的是IntelliJ IDEA软件。
那时百度还小,但已经能发现好东西了。
我在百度上搜索“InteliJ IDEA下载”,然后按照步骤中的提示,新建一个项目,选择HTML5 ,然后命名并保存。

然后,我开始创建一个新的 CSS 文件。
我将其命名为“styles.css”,听起来足够专业。
在 HTML 文件中,我编写了一个带有“标题 1 ”的 h1 标签,该标签被视为页面上的标题。
在CSS文件中,我写了一段代码来设置这个标题的颜色,具体是“color: red;”。
红色的颜色非常吸引人。

最重要的一步就在这里。
要调用 CSS 文件,我必须在 HTML 文件中使用链接标记。
这就像在 HTML 和 CSS 之间建立一座桥梁,让 CSS 样式应用到 HTML 上。
我写的是“<link rel='stylesheet' type='text/css' href='styles.css'>”。
这行代码就像是在告诉浏览器:“嘿,找到这个style.css文件,然后使用里面的样式。

当时,每次写完代码,我都会按运行按钮看看效果。
我很兴奋。
我记得有一次,我在路径中犯了一个错误,页面上的标题变色了。
我感觉很糟糕。
后来发现CSS文件和HTML文件必须在同一目录下,或者路径正确,否则样式将无法使用。

现在我想了一下,使用外部 CSS 文件实际上是一个好主意。
这不仅让我能够更好地管理风格不仅如此,它还可以更快地加载页面。
那时,每当我看到页面上的标题颜色发生变化时,我就感到非常满足,感觉自己的技术又进步了。
嘿,你必须亲自尝试一下才能真正体会其中的乐趣。