󰊒返回
怎样找到需要的模块?【请点击这里

怎样修改导航效果?

发布时间:2014-06-1 11:40:46

为更灵活控制网站导航效果,云网站提供以下几种方式进行更改效果:


一、通过更改主题来修改导航效果,操作如下:


进入排版模式下,选择【样式】==》【更改站点主题】;



在弹出的对话框里选择不同的主题进行更换,如下图所示:




二、通过【自定义样式】来修改


以下是导航栏的DOM结构:

<div class="page_nav_outer nav_s" style="">
<div class="page_nav_inner page page_960 page_width_land">
<div class="nav" id="nav">
<div class="nav_l"></div>
<div class="nav_r"></div>
<ul id="nav_list" class="navigation">
<li spp-id="1" class="nav_1 current"><a href="#">云站</a></li>

<li spp-id="34" class="nav_2"><a href="#">微信平台</a></li>

<li spp-id="35" class="nav_3"><a href="#">云网站</a></li>

<li spp-id="36" class="nav_4"><a href="#">手机应用</a></li>

<li spp-id="37" class="nav_5"><a href="#">视频</a></li>

<li spp-id="38" class="nav_6"><a href="#">案例</a></li>

<li spp-id="11" class="nav_7"><a href="#">模版</a></li>

<li spp-id="2" class="nav_8"><a href="#">动态</a></li>

<li spp-id="39" class="nav_9"><a href="#">管理平台</a></li>

</ul>
</div>
<div id="page_nav_option" style="display:none;">
<a href="javascript:void(0);" class="create_page">新建页面</a>
<a href="javascript:void(0);" class="sort_page">高级管理</a>
</div>
</div>
<div class="clear"></div>
</div>


导航DOM对应的CSS结构:

.nav_s .nav{}

.nav_s .nav_l{}

.nav_s .nav_r{}

.nav_s .navigation li{}

.nav_s .navigation li a, .nav_s .navigation li a:link, .nav_s .navigation li a:visited{}

.nav_s .navigation li.current a, .nav_s .navigation li.current a:link, .nav_s .navigation li.current a:visited{}



问题、建议反馈

问题解决了吗:

解决了。感谢您的支持
仍有问题。请填写下面的表单反馈给我们,我们会即时处理:
所在页面
*我有问题
*问题描述
验证码