JSFiddle - React, Tailwind, and code Playground

by gothic

HTML

<div id="all">
  <div id="left">导航菜单</div>
  <div id="right"><input type="button" id="btn" value="隐藏导航栏"/><br />这里是其他内容，用来测试当导航菜单被隐藏时是否自适应</div>
</div>

CSS

body{margin:0 auto;} 
    #all {
      width: 100%;
      height: 800px;
      background: red;
      margin: auto;
    }
    #left {
      width: 10%;
      height: 100%;
      float: left;
      background: #8a2be2;
    }
    #right {
      background: #e6e6e6;
      height: 100%;
    }

JavaScript

window.onload=function(){
    var oBtn = document.getElementById('btn');
    var o
}