思考?
我们如何将自己定义的样式应用到页面呢?(直白一点就是: 怎么把Css样式添加到html文档中)
添加方式
1. inline 模式
直接在需要应用样式的html tag当中的style属性中添加,
<p style="color: red">I should be red </p>
2. internal 模式
在<head>标签内部通过在<style>标签内定义:
<pre>
<!DOCTYPE html>
<html>
<head>
<title>css import demo</title>
<style>
p {
color: red;
}
</style>
</head>
<body>
<p> This should be red ! </p>
</body>
</html>
</pre>
3. external模式
将Css样式定义在单独的文件, 需要该样式的时候,只需要引入该样式文件即可.
例如:
3.1 创建名 example.css样式文件
3.2对example.css文件进行编辑,添加如下内容:
p { color: red; }
3.3 在html文件中引入该样式文件;
<pre>
<!DOCTYPE html>
<html>
<head>
<title> css import demo</title>
<link rel="stylesheet" href="example.css">
</style>
</head>
<body>
<p> This should be red ! </p>
</body>
</html>
</pre>
