好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

css第N级列表选择控制_html/css_WEB-ITnose

css ul li 选择 列表

请教各位,关于CSS中对多层列表的选择和控制。

效果如图片。

让一级菜单横排,二三四跟着一级竖排。

每级的字体大小和颜色都不同,CSS实在是弄不好,请求帮助,挺着急的,谢谢了。


回复讨论(解决方案)

网上不是很多无限极的啊。

http://www.neoease.com/tutorials/wordpress-menubar/wordpress-menubar-5/

此类问题你以后可以分析
你的菜单其实一共只有2个级别
主菜单:横向
字菜单:纵向

主菜单 可以嵌套包含 子菜单
子菜单 可以嵌套包含 子菜单
在下去就是子菜单的层次问题 只要css的嵌套声明即可 有几层就嵌套声明几次

                                                .menu{ /**主菜单区域*/                list-style: none;                padding: 0;                margin: 0;            }            .menu>li{ /**主菜单 菜单项*/                display: block;                float: left;                color: red;                text-align: center;            }            .menu>li ul{            /**统一所有子菜单样式*/                list-style: none;            }            .menu>li>ul{ /**子菜单区域 1级别*/            }            .menu>li>ul>li{ /**子菜单 1级 菜单项*/                color: green;            }            .menu>li>ul>li>ul{ /**子菜单区域 2级别*/            }            .menu>li>ul>li>ul>li{ /**子菜单 2级 菜单项*/                color: blue;            }            .menu>li>ul>li>ul>li>ul{ /**子菜单区域 3级别*/            }            .menu>li>ul>li>ul>li>ul>li{ /**子菜单 3级 菜单项*/                color: #ccc;                font-size: 10px;            }            /**下面可以依照上面的类推*/                                                         主菜单1                                      子菜单1级                      子菜单1级                      子菜单1级                                                            主菜单2                                      子菜单1级                                                      子菜单2级                              子菜单2级                              子菜单2级                                                                    子菜单1级                      子菜单1级                                                            主菜单3                                      子菜单1级                                                      子菜单2级                                                                      子菜单3级                                      子菜单3级                                      子菜单3级                                                                                            子菜单2级                              子菜单2级                                                                    子菜单1级                      子菜单1级                                               

此类问题你以后可以分析
你的菜单其实一共只有2个级别
主菜单:横向
字菜单:纵向

主菜单 可以嵌套包含 子菜单
子菜单 可以嵌套包含 子菜单
在下去就是子菜单的层次问题 只要css的嵌套声明即可 有几层就嵌套声明几次

                                                .menu{ /**主菜单区域*/                list-style: none;                padding: 0;                margin: 0;            }            .menu>li{ /**主菜单 菜单项*/                display: block;                float: left;                color: red;                text-align: center;            }            .menu>li ul{            /**统一所有子菜单样式*/                list-style: none;            }            .menu>li>ul{ /**子菜单区域 1级别*/            }            .menu>li>ul>li{ /**子菜单 1级 菜单项*/                color: green;            }            .menu>li>ul>li>ul{ /**子菜单区域 2级别*/            }            .menu>li>ul>li>ul>li{ /**子菜单 2级 菜单项*/                color: blue;            }            .menu>li>ul>li>ul>li>ul{ /**子菜单区域 3级别*/            }            .menu>li>ul>li>ul>li>ul>li{ /**子菜单 3级 菜单项*/                color: #ccc;                font-size: 10px;            }            /**下面可以依照上面的类推*/                                                         主菜单1                                      子菜单1级                      子菜单1级                      子菜单1级                                                            主菜单2                                      子菜单1级                                                      子菜单2级                              子菜单2级                              子菜单2级                                                                    子菜单1级                      子菜单1级                                                            主菜单3                                      子菜单1级                                                      子菜单2级                                                                      子菜单3级                                      子菜单3级                                      子菜单3级                                                                                            子菜单2级                              子菜单2级                                                                    子菜单1级                      子菜单1级                                               



非常感谢,一下觉悟了,真的很感谢!

同时感谢楼上的各位。


我的问题出在

主菜单1

子菜单1级

在“主菜单1”后面就把 给结尾了,没有包含子 ,哈哈哈,真的很感谢

查看更多关于css第N级列表选择控制_html/css_WEB-ITnose的详细内容...

  阅读:33次