动态神器:Cascading Style Sheets
在模板市场中看到的点击切换效果和轮播图效果等都是使用CSS实现的。
鼠标响应的妙用
店铺中经常能看到将光标放到宝贝上,宝贝切换为反面展示,或切换到其他颜色的宝贝图,或改变背景出现商标图案的效果,这个效果就是使用hover实现的。
hover效果是当光标移动到一个匹配的元素上面时,会触发指定的第一个函数。当光标移出这个元素时,会触发指定的第二个函数。当光标移至其中一个图上时,就会激活这个图所在框的hover状态,改变这个框的背景图片,即实现翻转效果。
下面使用hover实现切换宝贝颜色的效果。
01 在Dreamweaver软件中新建一个HTML文档,在CSS设计器中单击“添加CSS源”按钮,在展开的列表中选择“在页面中定义”选项。
02 添加源后选中“全局”,并单击“添加选择器”按钮。
03 输入名称,在名称前添加“.”。