title: How to make this Header/Content/Footer layout using CSS?
body: <pre><code> ______________________
  |        Header        |
  |______________________|
  |                      |
  |                      |
  |        Content       |
  |                      |
  |                      |
  |______________________|
  |        Footer        |
  |______________________|
  </code></pre>
  
  <p>I would like to make this UI, and each is a div. The header height is 30px. And the footer is 30px. But I don't know the content height. I need to use the user frame to calculate. </p>
  
  <p>The total height should be 100%. </p>
  
  <p>Can I do it in pure CSS?</p>