如何将 CSS 文件链接到 Brackets 上的 html 页面

Question

我在将我的 css 文件链接到我创建的页面之一时遇到了麻烦。 上传的图片显示了我尝试将两者链接起来，以及 css 文件中的代码。 css 文件和 html 文件都在同一个文件夹中。但是，我的主页无法识别 css。 任何帮助将不胜感激。 谢谢你。

链接css

css文件代码

Answer 1

基本上，样式可以使用以下三种方法之一链接到 HTML 文档：

内联样式
嵌入样式（内部样式）
外型

如何将 CSS 样式表连接到 HTML 页面

内联样式
内联样式是将 CSS 样式添加到 HTML 页面的最简单方法。 内联样式通过其样式属性应用于文档中的特定标签，应用于 HTML 文档，
例如，如果要向 < p > 添加样式，则可以这样编写代码：
<p style="color: #0000FF">...<p>
上述声明将确保段落文本为蓝色。 此方法可以应用于 HTML 页面的< body > .... < /body >内的任何 HTML 元素。

例子：

 <html> <body> <p style="color: #0000FF"> Instyle Paragraph Testing </p> <p> Another Paragraph Testing </p> </body> </html>

请注意，第一个< p >段落中包含的文本将为蓝色。 可以看到只有那一段受到影响，第二段默认为黑色。

内联样式的主要缺点是无法重用。 考虑重构一个包含数百个页面的网站，其中内联样式乱扔标记。 您必须进入每个页面并单独更改每个 CSS 属性是一项非常艰巨的任务。

嵌入样式（内部样式）
嵌入样式允许您通过将它们放置在开始和结束样式标记之间来实现任意数量的 CSS 样式。
<style>......</style>
您可以将样式标记放置在< head > ... < /head >部分中，就在 HTML 页面的< title >标记之后。

像这样

<head>
  <style>
    ........
    ........
  </style>
</head>

您应该从如下所示的开始样式标记开始： <style type="text/css">

开始样式标签应始终使用属性“类型”。 在 CSS 文档的情况下，属性值为“text/css”。

例子：

 <html> <head> <title>Embedded Style Sample</title> <style type="text/css"> h1{ color: #0000FF; } h2{ color: #00CCFF; } </style> </head> <body> <h1>Embedded Style testing</h1> <h2>Next Line</h2> </body> </html>

外型
外部样式表是仅包含 CSS 样式格式的纯文本文件。 外部文件的扩展名应以 .css 扩展名结尾（例如 pagestyle.css） 。 此外部文件称为外部样式表。
外部样式表（.css 文件）始终与 HTML 文件分开。 您可以使用 <link> 标记将此外部文件（.css 文件）链接到您的 HTML 文档文件。 您可以将此 <link> 标记放在< head >部分中，并放在 HTML 文件的< title >元素之后。
<link rel="stylesheet" type="text/css" href="styles.css" />

例如，您的HTML文件放置在一个文件夹中假设您的文件夹名称是WebDesign ，您的 CSS 文件也放置在该文件夹中，即在您的 html 文件中，CSS 将像这样直接链接的 WebDesign 文件夹

<link rel="stylesheet" type="text/css" href="styles.css" />

如何将 CSS 文件链接到 Brackets 上的 html 页面

问题描述

1 个解决方案

解决方案1
1 2019-11-24 14:23:51

如何将 CSS 文件链接到 Brackets 上的 html 页面

问题描述

1 个解决方案

解决方案1 1 2019-11-24 14:23:51

解决方案1
1 2019-11-24 14:23:51