谁能帮我看一下，js的，为什么我这个显示不出来，好的必采纳

我这个代码里面的

div li{background: #545178;border-bottom:1px solid #fff ;}
        div th{background: #515278;border-bottom:1px solid #fff ;}

第一个就能显示出来颜色，第二个显示不出来

img

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>折叠菜单</title>
    <style>
        ul{list-style: none;padding: 0;margin: 0;}
        div{width: 100%;border: 1px solid #5d7851;margin: 1px;}
        div li{background: #545178;border-bottom:1px solid #fff ;}
        div td{background: #515278;border-bottom:1px solid #fff ;}
        div li a{text-decoration: none;color: #fff;font-size: 16px;height: 40px;line-height: 63px;padding-left: 10px;}
        div li a:hover{text-decoration: underline;}
        .wrap {width: 100%;display: none;}
        .wrap li{background: white;margin: 0;}
        .wrap li a{color: #5f383a;font-size: 15px;}
        #left{width: 40%;float: left;overflow: hidden;}
        #right{width: 60%;float: left;margin-left: -10px;display: inline;overflow: hidden;}
        
    </style>
    <div id="left">
      <div id="fold">  
        <ul>
            <li>
                <a href="#">鞋类</a>
                <ul class="wrap">
                    <li><a href="#">经典老爹鞋</a></li>
                    <li><a href="#">新款帆布鞋</a></li>
                </ul>
            </li>
            <li>
                <a href="#">玩具类</a>
                <ul class="wrap">
                    <li><a href="#">经典黄鸡玩偶</a></li>
                    <li><a href="#">新款小单车玩具</a></li>
                </ul>
            </li>
            <li>
                <a href="#">裤子类</a>
                <ul class="wrap">
                    <li><a href="#">经典裤子</a></li>
                    <li><a href="#">新款皮裤</a></li>
                </ul>
            </li>
            <li>
                <a href="#">科技类</a>
                <ul class="wrap">
                    <li><a href="#">经典苹果电脑</a></li>
                    <li><a href="#">新款菠萝手机</a></li>
                </ul>
            </li>
        </ul>
    </ul>
      </div>
    </div>
    <div id="right">
        <table border="1" cellspacing="73%" cellpadding="27%">
            <thead>
                <th><input type='checkbox'></th>
                <th>商品</th>
                <th>数量</th>
                <th>单价</th>
                <th>状态</th>
                <th>库存</th>
                <th>小计</th>
            </thead>

我复制了你的代码发现这一行有点问题，然后把这一行前面的删除到顶格表头背景颜色就可以显示出来了。

img


我试了一下，上面图上圈起来这个必须要删掉才可以，不然你把表头样式放到下一行还是无法正常显示。

img

img


从你这里的部分代码来看，问题主要是两个
1 标签没闭合，主要是因为这个所以渲染不正常
html里面绝大部分标签都是成对出现闭合的，写的时候要注意用法
比如

<html>
  <head>
    <style><style/>
  </head>
  <body>
    <div>内容区域</div>
  </body>
</html>

2 你的html结构不对，style样式可以放在head标签里面这个没问题，但是你的内容部分应该放在body标签里面，就是下面这张图里面画的这样

img

指的是左边还是右边？我拿你的代码都显示了