【凡哥教程第二十五讲作业之二】移入移出变色（JS操作CSS属性和HTML属性）

花简静

作业二：有一个元素，部分代码如下所示，它已经拥有CSS样式，但我们还希望在交互时它能动态地产生一些变化，具体是，设备指针（pointer）移入元素界面时前景色是红色、背景色是浅绿色，移出时前景色是黑色、背景色是浅蓝色。同样使用上述代码结构，请通过纯CSS方式实现作业一JS能实现的功能。提示：本作业不使用JS，仅需给 CSS 加一个伪类选择器。

移入 背景绿 前景红
移出 背景蓝 前景黑

花简静

<style> #qsfg256 { width: 600px; height: 200px; font-size: 2rem; text-shadow: 1px 1px 2px gray; background: lightblue; border: 2px solid gray; padding: 10px; } #qsfg256:hover { background: LightGreen;color: red; font-size: 3rem;} </style> <div id="qsfg256">移入 背景绿 前景红<br>移出 背景蓝 前景黑</div>  

花简静

@凡哥
作业二原来比作业一更简单，
仔细看了作业要求，老师有提醒用伪类选择器。

这样的理解不知道对不对。

凡哥

花简静 发表于 2024-8-25 17:37
@凡哥
作业二原来比作业一更简单，
仔细看了作业要求，老师有提醒用伪类选择器。

就是用元素的 :hover 伪类选择器，它其实是一个指针设备滑过事件。作业完全正确。

花简静

凡哥 发表于 2024-8-25 18:28
就是用元素的 :hover 伪类选择器，它其实是一个指针设备滑过事件。作业完全正确。 ...

只记得鼠标划过有变化的就是色彩啊，大小呀之类的，用的就是:hover，
又翻了一下前面的教程，它就是伪类选择器
这 就对上了，哈哈。。

扬帆

谢谢老师，谢谢静版，祝愉快

碧海

欣赏简静精彩作业~~

碧海

问好简静，感谢你的精彩作业~~

碧海

祝简静学习愉快，新周快乐~~

柒玥

先占位置，回家看看再完成作业。