直播app开发搭建，纯css/html实现侧边导航栏

css代码：

<br> *{<br>    margin: 0px;<br>    padding: 0px;<br>  }<br>  #box{<br>      position: absolute;<br>      height: 300px;<br>      width: 150px;<br>      <br>      right: -150px;<br>      text-align: center;<br>      position: fixed;<br>      transition: 0.75s;<br>      border-radius: 20px;<br>  }<br>  #box2{<br>    width: 500px;<br>  }<br>  ul li{<br>      list-style: none;<br>      overflow: hidden;<br>      <br>  }<br>  ul li a{<br>      position: relative;<br>      text-decoration: none;<br>      /* background-color: aqua; */<br>      display: block;<br>      line-height: 30px;<br>  }<br>  ul li a:hover{<br>      background-color:lightsteelblue;<br>  }<br>  <br>  #chb{<br>      display: none;<br>  }<br>  label{<br>      position: absolute;<br>      position: fixed;<br>      right: 150px;<br>      width: 50px;<br>      height: 50px;<br>      background-color: burlywood;<br>      border-radius: 15px;<br>      display: inline-block;<br>      color:orangered ;<br>      font-size: large;<br>      text-align: center;<br>      line-height: 45px;<br>      cursor: pointer;<br>  }<br>  #chb:checked ~ #box{<br>      right: 0px;<br>  }

html代码：

<br><html><br><head><br>    <meta charset="UTF-8"><br>    <meta http-equiv="X-UA-Compatible" content="IE=edge"><br>    <meta name="viewport" content="width=device-width, initial-scale=1.0"><br>    <title>Document</title><br>    <link rel="stylesheet" href="daohang.css"><br></head><br><body><br>    <input type="checkbox" id="chb"><br>    <label for="chb">菜单</label><br>    <div id="box"><br>        <ul><br>            <li><a href="#">首页</a></li><br>            <li><a href="#">用户管理</a></li><br>            <li><a href="#">用户配置</a></li><br>            <li><a href="#">内容</a></li><br>            <li><a href="#">功能配置</a></li><br>            <li><a href="#">管理员</a></li><br>        </ul><br>    </div><br>    <div id="box2"><br>    </div><br></body><br></html>