在前端开发中怎么引用外部的CSS样式

在前端开发中怎么引用外部的CSS样式

在前端开发中，我们一般将html页面和css样式分开写，但是这样有什么好处呢？或者是为何非要这样写呢？其实写在一起喝分开写效果是一样的，但是写在外面的话一个CSS样式可以用来修饰很多页面，写在里面的话一个css就只能应用在当前页面，造成代码冗余。

打开一款自己使用着顺手的一款编辑器，然后创建一个web项目，在这里我创建了一个项目,项目名字叫叫demo。

在新创建的demo项目中，有一个css文件夹，里面并没有文件，这时我们创建一个css文件，创建的步骤：右键CSS文件→新建→CSS文件。

完成上述步骤后，会出现一个创建的弹窗，根据需要创建css名称，我这里命名为demo.css，然后点击确定，这时候我们的css文件夹里面就会出现一个叫demo.css的文件。

css文件创建完成后，我们回到我们的index.html页面，实现我们先写一些简单的代码，顺便看一下效果。

然后我们根据我们的html代码，打开我们的demo.css文件，给它写一些css样式修饰一下，为了显得明显我们给他们加一个颜色。html的代码和css的样式都一样准备完毕了，这时候让我们再运行一下我们的代码看一下有木有效果，很显然没有什么用。

因为我们还缺少最重要的一部就是把他们给链接 起来，打开我们的index.html界面，在head里面加上挂载的代码：最后再让我们运行一下没看一下效果究竟怎么样，CSS样式是不是加载上了。看下图 ,很明显效果出来了。