这是我参与2022首次更文挑战的第8天，活动详情查看：2022首次更文挑战。
web基础
掌握CSS的引入方式
CSS（层叠样式表）定义了HTML元素在页面中的样式、布局以及整个页面的布局。CSS遵循W3C规范，实现了跨浏览器的标准化。
1、行内样式
直接使用HTML元素的
style属性引入CSS样式
例：
<p style=＂font-size: 16px; color: #333;＂>软件工程师能力认证</p>
2、内嵌样式
使用
<style></style>标签引入样式<style> p { color: #333; font-size: 16px; } </style>
3、外部样式
3.1 链接样式（最常用）
在
<head></head>标签中，使用<link />标签链接外部的CSS文件
link标签的href属性设置为目标链接的CSS文件路径，rel属性设置为stylesheet表示链接样式表，type属性设置为text/css
例：
<link rel="stylesheet" href="style.css" type="text/css" />
3.2 导入样式
使用
@import url()引入CSS文件
- 在CSS文件中直接使用
@import url() - 在HTML文件中需要在
<style></style>标签中使用@import url()
在HTML初始化时，
@import url()导入的CSS会被直接导入到HTML或CSS文件中，成为文件的一部分
// 在HTML文件中导入
<style>
@import url(style.css);
</style>
// 在CSS文件中导入
@import url(style.css);
CSS引入方式-01
现需要导入外部样式表，请补全代码片段
<head>
<meta charset="utf-8">
<link type="text/css" rel="________" href="style.css" />
</head>
stylesheet
-
link标签用于链接外部文档，最常用的是方式是用于链接样式表 -
link标签常用属性：href：被链接文档的位置（URL）type：规定被链接文档的MIME类型rel：规定当前文档与被链接文档之间的关系
CSS引入方式-02
现需要导入外部样式表，请补全代码片段
<head>
<meta charset="utf-8">
<link type="text/css" rel="stylesheet" ______="style.css" />
</head>
href
CSS引入方式-03
现有以下代码片段，需要在行内引入CSS样式，补全代码片段
<p _______="color: #333; font-size: 16px;">有出路</p>
style
CSS引入方式-04
现需要在index.css中引入文件style.css，补全代码片段
/* index.css */
________ url('style.css')
p {
font-size: 16px;
}
/* style.css */
p {
color: red;
}
@import
使用@import url()可以在CSS文件中引入另外的CSS文件
CSS引入方式-05
现需要导入外部样式表，请补全代码片段
<head>
<meta charset="utf-8">
<link type="text/css" rel="________" href="style.css" />
</head>
stylesheet
