马上注册，结交更多好友，享用更多功能^_^
您需要 登录 才可以下载或查看，没有账号？立即注册
x
本帖最后由 不二如是 于 2019-9-5 07:57 编辑
万众瞩目的 零基础入门学习Web开发（H5&C3）开始更新了！！！ 
在Web新纪元 |【鱼C#视频课程】剧透这个系列的诞生，时间总是善待任何想拿它搞事情的存在体。
很幸运，一切就这样开始了，开局总会有些不足，但一切在慢慢变好，不是吗？
作为，吹水阁中最爱吹水（爱干无意义事情）的鱼油，整套教程的亮点（槽点）由我来承包～
关注本系列推送（最下方有订阅方式）的鱼油，会享受到一个福利：
会比正常推送，早一个时间节点，看到还未出炉的美味课程
哈哈，废话不多说了， #敲黑板时刻！ 
课程思维导图
1、基础的 CSS 语法
在之前的课程中，我们已经使用过很多次 CSS 了，来复习一下。
一段正确的 CSS 代码：
p{color:red;font-size:14px}
在后续的课程中我们会详细介绍选择器和各种属性的用法。
如果遇到疑问，鱼油可以查看速查宝典：传送门
2、插入 CSS 样式表
分为 3 种引入 CSS 的方式：
一段基础的代码：
<!DOCTYPE html>
<html>
<head>
<title>031讲</title>
<meta charset="utf-8">
</head>
<body>
<p>I Love CSS.</p>
<p>I Love FishC.</p>
</body>
</html>
<p style="color: #2ebb96">I Love CSS.</p>
如果页面中所有属性都通过这种方式写，将会是极大的浪费。
例如有 100 个 p 元素，难道每个都要手写嘛？！
那就可以用内部样式表了，代码不变，在 head 元素中增加 style 元素：
<head>
<title>031讲</title>
<meta charset="utf-8">
<style>
p{
color: red;
font-size: 22px;
}
</style>
</head>
这个就是优先级问题，在内部样式表为所有 p 元素指定颜色和字体大小属性。
但是由于内联样式级别高于内部样式表，所以当有冲突后，以优先级高的样式设置为准。
当想为页面内多个元素添加样式时可以采用内部样式表。
当想为多个页面增加统一的样式可以采用外部样式表。
一个好玩的例子：
我们在页面中添加一个新的 p 元素：
<p class="myFishc">I Love Python.</p>
如果位置不一样，鱼油务必将引入路径指定正确。
代码：
p{
color: black;
font-size: 22px;
}
.myFishc{
color: yellow;
font-size: 33px;
}
<link rel="stylesheet" href="style.css">
<style>
p{
color: red;
font-size: 22px;
}
</style>
虽然在外部样式表中，修改了 p 元素的样式，但只有新增的类为 myFishc 的 p 元素样式改变了。
这依旧是优先级问题：内联>内部>外部
3、注意事项
虽然 CSS 中没有限制空格的使用，意味着如下写法没问题：
p{
color : red;
font-size: 22px;
}
对大小写不敏感，但建议都用小写。
看懂上面的案例，应该就理解 CSS 样式存在优先级的问题了。
课后作业，完成了吗？
传送门
如果有收获，别忘了评分 ：
这位鱼油，如果喜欢本系列学习笔记，请订阅 专辑☞（ 传送门）（ 不喜欢更要订阅 ）
| 
( 粤ICP备18085999号-1 | 粤公网安备 44051102000585号)
狗仔卡
发表于 2019-8-25 08:05:21
置顶卡
千斤顶
显身卡
发表于 2019-8-27 16:51:30
