声享正努力加载中...
王江波
2020-10-23 14:30
<!DOCTYPE html> <html lang="en"> <head> </head> <body> <div id="main"> <div class="red">第一行：颜色是红色？</div> <div class="green">第一行：绿色</div> </div> </body> </html>
以下是一个页面源码的一部分，请用原生的JavaScript实现一个函数，把”第一行：颜色是红色？”的文字背景色设置为红色，把”第二行：绿色“的内容隐藏
🌰
认识CSS
——从认识浏览器开始
浏览器的渲染过程
CSS的基本概念
盒模型
选择器
阴影和滤镜
CSS函数和CSS变量
CSS 伪类和伪元素
::before & ::after 实现气泡对话框
:empty 判断返回数据为空
:hover定制悬浮提示
:valid & :invalid 验证表单
:check 模拟切换按钮
CSS 属性选择器
为链接匹配图标
表单中的required项，如何显示星号呢
阴影和滤镜能让视觉元素看上去更具立体感
阴影为视觉元素提供了边界轮廓，
滤镜为视觉元素提供了多变外观。
阴影效果有三剑客，分别是box-shadow、text-shadow、drop-shadow()。
box-shadow和text-shadow都是一个属性，
而drop-shadow()是filter里的滤镜函数，用于透明图像的非透明部分轮廓产生阴影效果
box-shadow 聚焦区域
CSS Patterns Gallery
drop-shadow
使用filter开启深色模式
filter ——
迭代计数器 counter()
计算属性 calc()
attr(val)用于返回节点属性，通常结合伪元素的content使用
CSS变量
CSS变量又名CSS自定义属性，指可在整个文档中重复使用的值。它由自定义属性--var和函数var()组成，var()用于引用自定义属性。
自身属性——
使用CSS变量实现放大镜
使用组合选择器实现一个评分控件
