📢📢📢📣📣📣
哈喽！大家好，我是「奇点」，江湖人称 singularity。刚工作几年，想和大家一同进步🤝🤝
一位上进心十足的【Java ToB端大厂领域博主】！😜😜😜
喜欢java和python，平时比较懒，能用程序解决的坚决不手动解决😜😜😜
✨ 如果有对【java】感兴趣的【小可爱】，欢迎关注我❤️❤️❤️感谢各位大可爱小可爱！❤️❤️❤️
————————————————如果觉得本文对你有帮助，欢迎点赞，欢迎关注我，如果有补充欢迎评论交流，我将努力创作更多更好的文章。
目录
👩🏫：我们上节课学习了css的基本知识，这节课我们学习一下css最基本的使用，来看看加了样式之后，我们的页面会有什么样子的变化吧。
CSS的写法及推荐写法
内部样式表：
写在元素的style标签⾥⾯的
👨🏫： css和html的写法有很多不同，今天我们就来说说css的几种写法和推荐的写法。主要写法有三种方式，我们依次讲解。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
color: red;
}
</style>
</head>
<body>
<div>
百度
</div>
</body>
</html>
这里设置了一个简单的样式，div中的颜色是红色。
内联样式表
写在styles属性⾥⾯的，整行的样式都会改变
<div style="background-color:yellow">
谷歌
</div>外部样式表（推荐）
通过link标签将css资源引⼊，这种方式和我们之前html中的img标签的方式差不多
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div {
color: red;
}
</style>
<link rel="stylesheet" href="./style.css">
</head>
<body>
<div>
百度
</div>
<br>
<div style="background-color:yellow">
谷歌
</div>
<br>
<div>
腾讯
</div>
</body>
</html>👨🏫：看了这么三种引入css样式的方法，我们能很容易的发现第三种，使用外部样式方式是最好的，符合我们的编码规则，减少了一样的代码的重复编写等这种方式有一下三种优点
- 解决相同样式代码等重复编写
- 代码分离，利于维护和阅读
- 浏览器会缓存，提高页面的响应速度
本文含有隐藏内容，请 开通VIP 后查看