CSS基础_@拉钩教育【笔记】

目录

1.什么是CSS?(层叠样式表)

2.CSS语法(选择器{属性:值;属性:值})

**CSS是控制+修饰网页内容样式

3.注释

/*...*/

4.外部样式

(1)外部样式

(2)内部样式

(3)内联样式

(4)不冲突,叠加;冲突,就近原则

(5)属性和值

5.CSS选择器

(5.1)常用兼容选择器

(1)html选择器(比较笼统)

划重点:RGB颜色6位16进制,每2位分别控制红/绿/蓝,

例如:

[#00ff00 绿色](#00ff00 绿色)

[#ff0000 红色](#ff0000 红色)

[#ff00ff 紫色 #红、蓝都参一点](#ff00ff 紫色 #红、蓝都参一点)

[(2)类选择器 (.类属性)](#(2)类选择器 (.类属性))

(3)id选择器 (#id属性)

**优先级 #id>.类>html

[(4)关联选择器(包含选择器) 有空格的编辑](#(4)关联选择器(包含选择器) 有空格的编辑)

(5)组合选择器(选择器组)

(6)伪类选择器

(5.2)其他选择器

(1)关系型选择器

(2)属性选择器

(3)结构性伪类选择器

(4)状态伪类选择器

(5)其他伪类选择器


1.什么是CSS?(层叠样式表)

2.CSS语法(选择器{属性:值;属性:值})

**CSS是控制+修饰网页内容样式

3.注释

/*...*/

4.外部样式

(1)外部样式
(2)内部样式
(3)内联样式
(4)不冲突,叠加;冲突,就近原则
(5)属性和值

5.CSS选择器

(5.1)常用兼容选择器

(1)html选择器(比较笼统)
划重点:RGB颜色6位16进制,每2位分别控制红/绿/蓝,
例如:
#00ff00 绿色
#ff0000 红色
#ff00ff 紫色 #红、蓝都参一点
(2)类选择器 (.类属性)

class属性=cc的,采用这个标签

(3)id选择器 (#id属性)

**优先级 #id>.类>html

就算如图所示:显示绿色,因为他的优先级依次高于其他2个.

(4)关联选择器(包含选择器) 有空格的
(5)组合选择器(选择器组)
(6)伪类选择器

更具超链接的不同状态:颜色等属性的变化。

a: 超链接 link未访问 visited已访问 hove鼠标放上去 active激活(鼠标放上去en过之后的)

(5.2)其他选择器

(1)关系型选择器

1.空格 (所有)

2.> (子标签)

3.div+ (div后紧邻)

4.div~ (div后所有)

(2)属性选择器

(3)结构性伪类选择器

(4)状态伪类选择器

1.当鼠标放上去;(上面)

2.当鼠标点击。

(5)其他伪类选择器
相关推荐
独立开阀者_FwtCoder几秒前
"页面白屏了?别慌!前端工程师必备的排查技巧和面试攻略"
java·前端·javascript
慧一居士几秒前
Vite 完整功能详解与 Vue 项目实战指南
前端·vue.js
南岸月明几秒前
不聊主业,聊聊你们眼中的副业是什么样的?
前端
Kevin在掘金920146 分钟前
c#、.net、Fluent UI Blazor
前端
LovelyAqaurius7 分钟前
RSA加密算法:从数学魔法到现实守护
前端
Hilaku8 分钟前
说实话,React的开发体验,已经被Vue甩开几条街了
前端·javascript·vue.js
蛋黄蛋黄12 分钟前
微信表情怎么在自己的项目使用微信表情?-> [开源仓库]wechat-emoji
前端·github
汪子熙13 分钟前
错误剖析:net::ERR_HTTP2_PROTOCOL_ERROR 200 (OK) 的含义与解决之道
前端
猩猩程序员15 分钟前
Rust 1.88 稳定支持裸函数:更安全简洁的汇编函数写法
前端
艾克马斯奎普特16 分钟前
为什么响应性语法糖最终被废弃了?尤雨溪也曾经试图让你不用写 .value
前端·vue.js·代码规范