<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>版权相关文章列表 | 皇家元林</title>
	<atom:link href="https://hjyl.org/tags/%E7%89%88%E6%9D%83/feed/" rel="self" type="application/rss+xml" />
	<link>https://hjyl.org</link>
	<description>刘元林的个人博客</description>
	<lastBuildDate>Tue, 23 Aug 2011 05:15:39 +0000</lastBuildDate>
	<language>zh-Hans</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>

<image>
	<url>https://img.hjyl.org/uploads/2019/10/cropped-about-me-32x32.png</url>
	<title>版权相关文章列表 | 皇家元林</title>
	<link>https://hjyl.org</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>WordPress二级导航功能CSS版</title>
		<link>https://hjyl.org/wordpress-second-wp-menu-css/</link>
					<comments>https://hjyl.org/wordpress-second-wp-menu-css/#comments</comments>
		
		<dc:creator><![CDATA[皇家元林]]></dc:creator>
		<pubDate>Tue, 23 Aug 2011 05:15:39 +0000</pubDate>
				<category><![CDATA[元林手札]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[WordPress]]></category>
		<category><![CDATA[主题]]></category>
		<category><![CDATA[二级导航]]></category>
		<category><![CDATA[版权]]></category>
		<guid isPermaLink="false">http://hjyl.org/?p=1824</guid>

					<description><![CDATA[看看WordPress默认主题的二级导航功能是怎么CSS的。。。]]></description>
										<content:encoded><![CDATA[<p>好长时间没博起了，今儿个雄起。。。唉，都怪宿舍网络不给力，老断网，没办法，便宜嘛！凑合着吧。。。</p>
<p>最近我的博客和W7C都还不错，排名一个劲往上凑，看了看统计，也没发现有多少流量，有点弄不清楚alexa是怎么排名的了，难道是别人退步了？很多人都很喜欢我yTwo和yCms这两个主题，我也很高兴。我发现更多的是新手，他们连说明都没看清楚就一个劲的问问题，“怎么会有logo下面都是页面的链接，分类哪去了”，“那个图片广告是怎么添加的”，“侧边栏怎么会只有一个小工具”等等，有时候我也很无助，但是没办法，还是得回答。也希望这些朋友们谅解，自定义菜单，后台设置，小工具设置，是WordPress最基础的，就算我没这个主题，它也是存在的，希望你们多多熟悉下WordPress先。。。</p>
<p><span style="color: #ff0000;"><em><strong>关于版权的说说。</strong></em></span>这个版权的问题虽然在我们这个国度很正常的问题，但是还是得说。就像之前五个木童鞋、萧涵童鞋一样，我也发现了这个问题。最近一位热心的童鞋发短信联系我，问了我一大堆的问题，怎么改这个怎么改那个，但当我看到他的网站的时候，他改的很彻底，所有关于皇家元林的信息全没了，包括版权。其实我做主题，为了方便大家，能自动调用的就自动调用自己博客上的内容，所以“皇家元林”的信息很少，而版权，我相信大家都明白，WordPress本身是个开源免费的博客，为了尊重做主题人的无私奉献，保留版权信息应该说是一种共识，对WordPress官方也一样，我们做主题的同样会加上一个WordPress官方的链接，表示尊重！如果我们看到自己的主题被别人改成他们自己的东西，而且他们还一个劲的问我们这个怎么改，那个怎么改，我们是什么样的心情？所以，我希望大家可以尊重我的主题，并且呼吁所有人可以尊重所有的主题！免费不一定是最好的，但是免费更需要得到尊重，这对你我他都没有损失！</p>
<p>言归正传。我最近帮一朋友做公司主题，终于明白了WordPress默认主题里二级导航的CSS设置。之前一直看不懂，也找了不少设置二级导航的方法，js版，query版等等，我都没有成功，所以我做主题一直都不支持二级导航。</p>
<p>不过这个方法有个缺点：不支持IE6.0！不过不要紧，我想现在没几个想用IE6的吧，如果你现在还在用IE6，那你真的out了！</p>
<p>首先看演示：<br />
<a href="https://hjyl.org/go/aHR0cDovL2kuNi5jbi9jdmJubS9kZS9mNS82OS9mMGExZTVjZDI1Nzc1OWMyNjk0ZDgyZmRjZGRjNTFjYS5wbmc=" rel="nofollow" target="_blank"><img decoding="async" title="Click to enlarge" src="http://i.6.cn/cvbnm/de/f5/69/f0a1e5cd257759c2694d82fdcddc51ca.png" alt="image" /></a></p>
<div id="caption_1314075512257" class="highslide-caption">WordPress二级导航演示</div>
<p>其次，我们来看我用的调用代码</p>
<pre lang="language" line="1"><?php wp_nav_menu('container=''&title_li=&link_before=<span>&link_after=</span>'); ?></pre>
<p>或者</p>
<pre lang="language" line="1"><?php wp_nav_menu( array( 'container_class' => 'menu-header', 'theme_location' => 'primary', 'link_before' => '<span>', 'link_after' => '</span>') ); ?></pre>
<p>即这样的结构：</p>
<pre lang="language" line="1">
<ul class="menu">
    <li class="current-menu-item current_page_item menu-item-home....">
        <a href="#"><span>主导航</span></a>
        <ul class="sub-menu">
             <li class="current-menu-item current_page_item menu-item-home....">
                 .......依次循环下去......
             </li>
        </ul>
    </li>
</ul>
</pre>
<p>注意看CSS样式：</p>
<pre lang="language" line="1">
ul.menu{background:#EEEEEE;display:block;height:44px;border-radius:0 5x 5px 0;}  //定义全局menu
.menu li{float:left;position:relative;list-style:none;padding:12px;line-height:20px;font-weight:bold;font-size:14px;} //定义主导航的排序，注意position很重要
.menu li a:hover{color:#fff;}
.menu li:hover > ul{display:block;background:#EEEEEE;}  //这个最关键，就是当鼠标hover时发生的事，注意display属性
.menu li:hover > ul li a{color:#737373;}
.menu li:hover > ul li a:hover{color:#FFF;}
.menu ul {box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);display: none;position: absolute;top: 44px;left: 0;float: left;width: 85px;z-index: 99999;} //这个也是最关键的，就是当鼠标移开时发生的事，注意display、position的属性。
.menu ul li {min-width: 85px; margin:0;padding:5px 0;}
.menu ul ul {left: 100%;top: 0;} //这句没看懂，但是觉得也是重要的，应该是关于三级导航的位置
.menu li:hover,li.current-menu-item, li.current_page_item, li.current-cat{background:#06B11A;box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2);}
li.current-menu-item a, li.current_page_item a, li.current-cat a{color:#fff;}
</pre>
<p>注释的很重要，其他的属性自己看着办，本例仅供参考。</p>
<div id="content-copyright"><span style="font-weight:bold;text-shadow:0 1px 0 #ddd;font-size: 13px;">版权声明: </span><span style="font-size: 13px;">本文采用 <a href="https://hjyl.org/go/aHR0cHM6Ly9jcmVhdGl2ZWNvbW1vbnMub3JnL2xpY2Vuc2VzL2J5LW5jLXNhLzMuMC8=" rel="nofollow" target="_blank">BY-NC-SA</a> 协议进行授权，如无注明均为原创，转载请注明转自 <a href="https://hjyl.org">皇家元林</a><br>本文链接: <a rel="bookmark" title="WordPress二级导航功能CSS版" href="https://hjyl.org/wordpress-second-wp-menu-css/">WordPress二级导航功能CSS版</a></span></div>]]></content:encoded>
					
					<wfw:commentRss>https://hjyl.org/wordpress-second-wp-menu-css/feed/</wfw:commentRss>
			<slash:comments>28</slash:comments>
		
		
			</item>
	</channel>
</rss>
