Home  >  Article  >  php教程  >  php左侧分类列表显示菜单,php左侧分类列表

php左侧分类列表显示菜单,php左侧分类列表

WBOY
WBOYOriginal
2016-06-13 08:54:34751browse

php左侧分类列表显示菜单,php左侧分类列表

<!DOCTYPE>
<html>
<head>
    <meta http-equiv="content-type" content="text/html" charset="utf-8">
    <title>商品分类导般菜单</title>
    <style><span>
        body {font</span>-family:\5B8B\4F53,Arial Narrow,arial,serif;background:<span>#</span><span>ffffff;font-size:12px; color:#313131;}</span>
        body,div,<span>dl</span>,dt,dd,ul,ol,li,pre,form,fieldset,input,textarea,blockquote{padding:0; margin:0<span>;}
        li{</span><span>list</span>-style-type:<span>none;}

        </span>.wrap {width: 960px; margin:0<span> auto;}
        </span>.wrap .leftzone {<span>float</span>: left;width: 200px;margin:10px 0<span>;}

        </span>.modTop .sidetitle{height:28px;background:<span>#</span><span>ccc; font-weight:bold;}</span>
        .modTop em{<span>float</span>:left;padding:6px 0 0 11px;font-style:normal;color:<span>#</span><span>000;}</span>
        .sidecontent{border-left:<span>#</span><span>CCC 1px solid;border-right:#CCC 1px solid;border-bottom:#CCC 1px solid;padding:6px;}</span>

        .my_left_category{width:<span>180px;}
        </span>.my_left_category h1{height:20px;font-size:14px;font-weight:bold;padding-left:15px;padding-top:8px;margin:0px;color:<span>#</span><span>FFF;}</span>
        .my_left_category .my_left_cat_list{width:178px;line-height:13.<span>5pt;}
        </span>.my_left_category .my_left_cat_list h2 {margin:0px;padding:<span>3px 5px 0px 9px;}
        </span>.my_left_category .my_left_cat_list h2 a {color:<span>#</span><span>d6290b;font-weight:bold;font-size:14px;line-height:22px;}</span>
        .my_left_category .my_left_cat_list h2 a:hover {color:<span>#</span><span>d6290b;font-weight:bold;font-size:14px;line-height:22px;}</span>
        .my_left_category .h2_cat{width:178px;height:26px;background-image:url('./images/my_menubg.gif');background-repeat:no-repeat;line-height:26px;font-weight:normal;color:<span>#</span><span>333333;position:relative;}</span>
        .my_left_category .h2_cat_1{width:178px;height:26px;line-height:26px;font-weight:normal;color:<span>#</span><span>333333;position:relative;}</span>
        .my_left_category a{font-size:12px;text-decoration:none;color:<span>#</span><span>333333;}</span>
        .my_left_category a:hover{text-decoration:underline;color:<span>#</span><span>ff3333;}</span>
        .my_left_category h3{margin:0px;padding:0px;height:26px;font-size:12px;font-weight:normal;display:block;padding-left:<span>8px;}
        </span>.my_left_category h3 span{color:<span>#</span><span>999999; width:145px; float:right;}</span>
        .my_left_category h3 a{    line-height:<span>26px;}
        </span>.my_left_category .h3_cat{display:none;width:204px;position:absolute;left:153px;margin-top:-26px;cursor:<span>auto;}
        </span>.my_left_category .shadow{position:inherit;width:<span>204px;}
        </span>.my_left_category .shadow_border{position:inherit;width:200px;border:1px solid <span>#</span><span>959595; margin-top:1px;border-left-width:0px;background:url('./images/shadow_border.gif') no-repeat 0px 21px;background-color:#ffffff;margin-bottom:3px}</span>
        .my_left_category .shadow_border ul{margin:0; padding:0; margin-left:<span>15px}
        </span>.my_left_category .shadow_border ul li {<span>list</span>-style:none;padding-left:10px;background-image:url('./images/my_cat_sub_menu_dot.gif');background-repeat:no-repeat;background-position:0px 8px;<span>float</span>:left;width:75px;height:26px;overflow:hidden;letter-spacing:<span>0px;}
        </span>.my_left_category .active_cat{ z-index:99;background-position:0 -25px;cursor:<span>pointer;}
        </span>.my_left_category .active_cat h3 { font-weight:<span>bold}
        </span>.my_left_category .active_cat h3 span{ display:<span>none;}
        </span>.my_left_category .active_cat div{display:<span>block;}

    </span></style>
</head>
<body>
<div <span>class</span>="wrap">
    <div <span>class</span>="leftzone">
        <div <span>class</span>="modTop"><div <span>class</span>="sidetitle"><em>商品分类</em></div></div>
        <div <span>class</span>="sidecontent">
            <div <span>class</span>="my_left_category">
                <div <span>class</span>="my_left_cat_list">
                    <div <span>class</span>="h2_cat" onmouseover="this.className='h2_cat active_cat'" onmouseout="this.className='h2_cat'">
                        <h3><a href="#">AA</a></h3>
                        <div <span>class</span>="h3_cat">
                            <div <span>class</span>="shadow">
                                <div <span>class</span>="shadow_border">
                                    <ul>
                                        <li><a href="#">a.1</a></li>
                                        <li><a href="#">a.2</a></li>
                                        <li><a href="#">a.3</a></li>
                                        <li><a href="#">a.4</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
</html>

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn