DedeCMS批改模板当鼠标有焦点时图片是呈现黄色块

fieldset{padding:10px;}

DedeCMS修改模板当鼠标有焦点时图片是呈现黄色块

一、需求分析

修改模板时想产生这样的效果：

当鼠标有焦点时图片是呈现黄色块的

二、解决方法

1、频道栏在head.htm中的定义

<div id="navMenu">    <ul><!--chenyujing 这里可以把首页去掉--><li><a href='{dede:global.cfg_cmsurl/}/'><span>首页</span></a></li>{dede:channel type='top' row='10' current>2、当鼠标时，即hover的css样式定义为：
#navMenu ul li a.hover span, #navMenu ul li a:hover span {cursor:pointer;display:inline-block;height:22px;    color:#DEFF01;line-height:20px;margin:0 0 0 5px;padding:0 5px 0 0;text-align:center;vertical-align:middle;}
以上CSS，最近一层HTML元素为span，因为我们的频道定义时最近一层是span：
样式定义的语法为两种情况下采用此样式：
（1）#navMenu ul li a.hover span
（2）#navMenu ul li a:hover span
3、在CSS定义块中添加BACKGROUND:url属性
#navMenu ul li a.hover span, #navMenu ul li a:hover span {cursor:pointer;display:inline-block;height:22px;    color:#DEFF01;line-height:20px;margin:0 0 0 5px;padding:0 5px 0 0;text-align:center;vertical-align:middle;BACKGROUND:url(menu_over.jpg) repeat-x;}
改进：
可以对BACKGROUND:url指定的路径采用相对路径（注意：路径是相对自己的css而言，不是相对于使用CSS的HTM文件的路径而言的。）
#navMenu ul li a.hover span, #navMenu ul li a:hover span {cursor:pointer;display:inline-block;height:22px;    color:#DEFF01;line-height:20px;margin:0 0 0 5px;padding:0 5px 0 0;text-align:center;vertical-align:middle;BACKGROUND:url(../images/menu_over.jpg) repeat-x;}

自己要先看得起自己，别人才会看得起你

相关文章：

你感兴趣的文章：

标签云：