其实只是很简单的增加一列li,然后用css来控制这部分li的表现,如果要应用到其他模版,请自行修改css部分的相关代码
在header.php合适位置添加如下代码:
- <div id="menu">
- <ul>
- <li>1</li>
- <li>2</li>
- <li>3</li>
- </ul>
- </div>
- <div id="wrapper">
style.css部分添加以下代码:
- #menu {
- position: relative;
- height:1.7em;
- line-height:1.7em;
- width:450px;
- padding: 0 0 0 20px;
- margin: -30px 0 0 0;
- z-index:2;
- }
- #menu ul {
- margin:0;
- padding:0;
- }
- #menu li {
- float:left;
- margin:0;
- padding:0;
- list-style-type:none;
- border-right:0px solid;
- white-space:nowrap;
- }
- #menu li a {
- display:block;>
- padding:0 5px;
- text-transform: uppercase;
- font-size:12px;
- letter-spacing:1px;
- color: #000;
- }
- #menu li a:hover {
- text-decoration: underline;
- }