SOURCE

console 命令行工具 X clear

                    
>
console
$('input[type=radio]').on('click', function(){
  let div = $('.'+$(this).prop('name'));
  let val = $(this).val()/1;
	div.attr('style', '');
  switch(val) {
    case 1:
  		div.css('float', 'left');
      break;
    case 2:
  		div.css('display', 'inline-block');
      break;
    case 3:
  		div.css('position', 'absolute');
      break;
    case 4:
  		div.css('overflow', 'hidden');
      break;
    default:
      div.attr('style', '');
      break;      
  }
});
<section>
  <div class="div-1">
    <div class="div-2"></div>
    <div class="div-3"></div>
  </div>
  <div class="div-4"></div>
</section>
<hr />
<ul>
  <li>
    <p>div-1</p>
    <p><input type="radio" name="div-1" value="0" />none</p>
    <p><input type="radio" name="div-1" value="1" />float</p>
    <p><input type="radio" name="div-1" value="2" />inline-block</p>
    <p><input type="radio" name="div-1" value="3" />absolute</p>
    <p><input type="radio" name="div-1" value="4" />not visible</p>
  </li>
  <li>
    <p>div-2</p>
    <p><input type="radio" name="div-2" value="0" />none</p>
    <p><input type="radio" name="div-2" value="1" />float</p>
    <p><input type="radio" name="div-2" value="2" />inline-block</p>
    <p><input type="radio" name="div-2" value="3" />absolute</p>
    <p><input type="radio" name="div-2" value="4" />not visible</p>
  </li>
  <li>
    <p>div-3</p>
    <p><input type="radio" name="div-3" value="0" />none</p>
    <p><input type="radio" name="div-3" value="1" />float</p>
    <p><input type="radio" name="div-3" value="2" />inline-block</p>
    <p><input type="radio" name="div-3" value="3" />absolute</p>
    <p><input type="radio" name="div-3" value="4" />not visible</p>
  </li>
  <li>
    <p>div-4</p>
    <p><input type="radio" name="div-4" value="0" />none</p>
    <p><input type="radio" name="div-4" value="1" />float</p>
    <p><input type="radio" name="div-4" value="2" />inline-block</p>
    <p><input type="radio" name="div-4" value="3" />absolute</p>
    <p><input type="radio" name="div-4" value="4" />not visible</p>
  </li>
</ul>
section {
  height: 200px;
}
li {
  margin-right: 20px;
  display: inline-block;
}
div {
  width: 100%;
  height: 30px;
  background: #fff;
  clear: both;
}
.div-1 {
  height: auto;
}
.div-2 {
  margin-bottom: 10px;
  background: #000;
}
.div-3 {
  margin-top: 20px;
  margin-bottom: 20px;
  background: #fe0002;
}
.div-4 {
  margin-top: 10px;
  background: #ffcb01;
}