前端开发是门很考验个人能力的技术活，学好的人年薪几十万不是问题，学不好的连一份糊口的工作都找不到，而css是前端的基础，今天就给大家分享一份爱前端css第一天课程的原版笔记，特别适合计算机小白学习奥！
一、CSS
1.1 简介
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言(JS)动态地对网页各元素进行格式化。 [1]
CSS 能够对网页中元素位置的排版进行像素级精确控制，支持几乎所有的字体字号样式，拥有对网页对象和模型样式编辑的能力。 [2]
CSS就是：韩国的整容术,中国的PS。简单来说就是让页面看上去不那么恶心。
1.2 书写位置和语法
把CSS放在head中
基本语法：选择器{属性:属性值;属性:属性值;····}
1.3 CSS调试
二、CSS2学习主旨
HTML：标签语义化
----------------------------------------------------------------------------------------
CSS:
Ⅰ:样式
Ⅱ:布局
标准流->盒子模型(width/height+padding+border+margin)、块元素和行内元素
浮动流->浮动的由来、浮动造成后果、清除浮动(比如BFC)
定位流->绝对 相对 固定
三、样式属性
3.1 文本
3.1.1 颜色表达
3.1.2 下划线
3.1.3 文本缩进
3.2 字体
3.2.1 字体加粗
3.2.2 字体
c盘->windows->fonts文件夹
3.2.3 符合属性font
3.3 列表
基本语法： list-style: none; 把列表默认的样式清空
3.4 背景
四、常用效果
4.1 鼠标悬浮
4.2 CSS注释
html注释：
css注释：/*注释内容*/
快捷键：ctrl+/
4.3 CSS调错
五、盒子模型
5.1 初识盒子模型
以淘宝举例子 我们可以简单的把淘宝分成上中下三部分。进而还可以继续划分。那么这个划分的各个领域我们称之为盒子。
5.2 盒子组成
盒子=width/height+padding+border+margin
六、块元素和行内元素
6.1 初识
标签 元素 标记都是一回事。
6.2 相互转换
display:block;->转换成块级元素
display:inline;->转换成行内元素元素
display:inline-block;->转换成行内块级元素
6.3 display的特殊值
隐藏显示元素
display:none;->display:block/inline/inlin-block;
七、选择器
基本语法：选择器{属性:属性值;属性:属性值;···}
7.1 基本选择器
7.1.1 通配符选择器*
7.1.2 标签选择器
标签{属性:属性值;属性:属性值;···}
7.1.3 ID选择器
ID命名：以字母 数字 - _组成,但是数字不能开头.咱们建议用英文命名,因为中文同音字、多音字比较多,容易造成命名的模糊,所以推荐使用英文命名。
注意：一个页面只能出现一个ID名
7.1.4 class选择器
7.1.5 优先级关系
权重： id选择器>class选择器>标签选择器>通配符选择器
7.2 高级选择器
7.2.1 并列选择器
7.3 class和id命名规范
1 ①由字母 数字 - 组成
2 ②数字不能开头
3 ③保证其语义化(建议)
福利时间
添加爱前端助理获取更多学习资料
微信：XX1350157805
qq: 2078256832
网友评论