• 网站首页
• 网站建设
• 短视频
• 网站推广
• 网站模板
• 客户案例
• 资讯动态
• 关于我们

用dreamweaver制作图片切换效果_CSS学习

当前位置：网站建设 > 技术支持

用dreamweaver制作图片切换效果？

在DreamWeaver中实现滑动切换图片效果，可以使用 ‘鼠标经过图像’ 功能来实现，也可以用CSS控制来实现。 现在具体讲一下 CSS控制实现 图片切换效果！ 首先制作一个 ID为abc 的div 宽度50px; 高度50px; 在abc里面随便打一个字 设置一个空链接。 然后定义 abc 宽度50px; 高度50px; a标签的块形式 代码如下：； <style type="text/css"> <!-- #abc a { height: 50px; width: 50px; display: block; } --> </style>； <!--注意上面才是CSS代码，下面是div--> <div id="abc"><href="#">字体</a></div> 然后设置 div的背景图片 比如图片名为 bj.gif CSS代码变为：； <style type="text/css"> <!-- #abc a { background-image: url(bj.gif); height: 50px; width: 50px; display: block; } --> </style>； 最后 设置鼠标经过的样式 比如 鼠标经过图片为 bjj.gif CSS代码 变为如下： ； <style type="text/css"> <!-- #abc a { background-image: url(bj.gif); height: 50px; width: 50px; display: block; } #abc a:hover { background-image: url(bjj.gif); } --> </style>

版权说明：
本网站凡注明“广州京杭 原创”的皆为本站原创文章，如需转载请注明出处！
本网转载皆注明出处，遵循行业规范，如发现作品内容版权或其它问题的，请与我们联系处理！
欢迎扫描右侧微信二维码与我们联系。