Меню и подменю html, css

.menu, 
#go { 
  display: none; 
} 
 
.st { 
  padding: 0 20px 0 20px; 
  background: green; 
  cursor: pointer; 
  color: white; 
} 
.st:before{ 
  content:'+'; 
} 
:checked+.st:before{ 
  content:'-'; 
} 
 
#go:checked~.menu { 
  display: block; 
}

<input id="go" type="checkbox" /> 
<label for="go" class="st"></label> 
<ul class="menu"> 
  <li><a href="#">подпункт 1</a></li> 
  <li><a href="#">подпункт 2</a></li> 
  <li><a href="#">подпункт 3</a></li> 
</ul>