发布时间:2023-06-20 10:00
1、趣调查
2、“装修小能手”
前面我们研究了HTML,回顾下它是做什么的?
当我们用HTML搭建好网页的基本骨架,下面请出我们的“装修小能手”--CSS。
3、如何学习CSS?
Python大星前去探探路...
4、学习必备
● 充分利用谷歌浏览器Chrome的审查元素功能
● CSS权威网站
https://developer.mozilla.org/zh-CN/docs/Web/CSS/Reference
1、基本问题
● CSS代码写在什么地方?
● CSS的语法规则?
2、CSS代码的书写位置
● 内部样式表
书写在style元素中,一般放在中。
有人可能会问,能放到其他元素里吗?
答案:可以。但如果你使用内部样式表,建议放到head元素中,利于浏览器的加载渲染。
>> 举个栗子:
● 内联样式表(元素样式表)
直接书写在元素的全局属性style中
● 外部样式表
将样式书写到独立的css文件中。
【1】理由有三:
① 解决多页面样式重复的问题;
② 有利于浏览器缓存,提高页面响应速度;
③ 有利于代码分离,易阅读和维护。
【2】如何使用外部样式表:
3、CSS代码的语法
CSS语法 = 选择器 + 声明块
● 选择器(Selector)
CSS 选择器是CSS规则的一部分,使你能应用样式到指定元素。
① 基础选择器
① 关系选择器
选择紧跟A元素后的B元素,用+表示,选择相邻的第一个兄弟元素。
选择A元素之后的所有兄弟元素B,作用于多个元素,用~隔开
选择所有作为A元素的直接子元素B,对更深一层的元素不起作用,用>表示
选择所有被A元素包含的B元素,中间用空格隔开,在CSS使用频率高
③ 伪类选择器
选中某些元素的某种状态
1)link: 超链接未访问时的状态2)visited: 超链接访问过后的状态3)hover: 鼠标悬停状态4)active:激活状态,鼠标按下状态爱恨法则:love hate
● 声明块
出现在大括号{}中
声明块中包含很多声明(属性),每一个声明(属性)表达了某一方面的样式。