目录
CSS简介
CSS概念
为什么需要CSS
CSS和HTML之间的关系
语法
学习效果反馈
CSS的引入方式
内联样式(行内样式)
内部样式
外部样式(推荐)
导入式(了解)
@import和link的区别
学习效果反馈
CSS样式表特征
继承性
层叠性
优先级
CSS注释
学习效果反馈
基础选择器一
全局选择器
元素选择器
学习效果反馈
基础选择器二
编辑ID选择器
合并选择器
选择器的优先级
学习效果反馈
DIV+CSS布局
布局时常用的属性
布局-上中下结构
学习效果反馈
布局实操一
布局实操二
CSS简介
CSS概念
为什么需要CSS
使用css的目的就是让网页具有美观一致的页面
CSS和HTML之间的关系
语法
CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明
选择器通常是您需要改变样式的 HTML 元素 每条声明由一个属性和一个值组成属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个值。属性和值被冒号分开
学习效果反馈
1.下列关于CSS基础语法描述错误的是:属性与属性值之间用分号隔开
CSS的引入方式
内联样式(行内样式)
要使用内联样式,你需要在相关的标签内使用样式(style)属性。 Style 属性可以包含任何 CSS 属性
内部样式
外部样式(推荐)
导入式(了解)
此种方式使用率比较低,因为会影响加载速度
@import和link的区别
学习效果反馈
1.外部CSS样式的引入方式,以下正确的是:
CSS样式表特征
继承性
指被包含在内部的标签可以拥有外部标签的样式,比如:text-、 font-、line-height,但有些属性不能继承,比如:border、 padding、margin
层叠性
简单的说,层叠就是对一个元素多次设置同一个样式,这将使用最 后一次设置的属性值。例如对一个站点中的多个页面使用了同一套 CSS样式表,而某些页面中的某些元素想使用其他样式,就可以针 对这些样式单独定义一个样式表应用到页面中。这些后来定义的样 式将对前面的样式设置进行重写,在浏览器中看到的将是最后面设 置的样式效果
优先级
样式定义冲突时,按照不同样式规则的优先级来应用样式 行内样式>内部样式(外部样式)
CSS注释
/* 这是注释 */
学习效果反馈
1.以下哪个不是CSS样式表特征:CSS注释
基础选择器一
全局选择器
可以与任何元素匹配,优先级最低,不推荐使用
元素选择器
类选择器
规定用圆点 . 来定义,针对你想要的所有标签使用
学习效果反馈
1.下列代码哪个是类选择器使用方式:.title{color:red;}
基础选择器二
ID选择器
合并选择器
作用:提取共同的样式,减少重复代码
选择器的优先级
CSS中,权重用数字衡量
元素选择器的权重为: 1
class选择器的权重为: 10
id选择器的权重为: 100
内联样式的权重为: 1000
优先级从高到低: 行内样式 > ID选择器 > 类选择器 > 元素选择器
学习效果反馈
1.下列选择器优先级排序正确的是:行内样式 > ID选择器 > 类选择器 > 元素选择器
DIV+CSS布局
优点
布局时常用的属性
布局-上中下结构
布局-上中下-左右
学习效果反馈
1.以下哪个不是 DIV+CSS 布局的优点:对搜索引擎不友好
布局实操一
布局实操二