Day3:CSS基础
详细介绍,可查看网站web 入门 - 学习 Web 开发 | MDN (mozilla.org)
在线编辑器:JS Bin - Collaborative JavaScript Debugging
CSS简介:
基本概念:层叠样式表 — 也就是CSS— 是你在HTML之后应该学习的第二门技术。HTML 用于定义内容的结构和语义,CSS 用于设计风格和布局。比如,您可以使用 CSS 来更改内容的字体、颜色、大小、间距,将内容分为多列,或者添加动画及其他的装饰效果。
CSS的引用:
- 外部样式表
HTML中的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CSS的引入</title>
<link rel="stylesheet" href="css/cssImport.css">
</head>
<body>
<p>hello world!</p>
</body>
</html>
CSS中的代码
p {
color:brown;
}
效果图
![](https://img-blog.csdnimg.cn/img_convert/41fcdcd262c51c38b322703c7dc41c57.png)
- 内部样式表
HTML中的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>CSS的引入</title>
<style>
p {
color:blue;
}
</style>
</head>
<body>
<p>hello world!</p>
</body>
</html>
效果图
![](https://img-blog.csdnimg.cn/img_convert/57f7c9462e54c04cfefe132fdd142a98.png)
3.标签中的style
HTML中的代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8&