to make notes in CSS Style Editor add     /*note*/

to remove header and footer,

Easiest way:  add this CSS to Settings / Advanced in ‘Page Header Code Injection’ on the selected page,
<style>
#header { display: none }
#footer { display: none }
</style>

or paste in CSS in Style Editor -paintbrush :

#collection-53dc65e3e4b0bb69bc51128b #header,
#collection-53dc65e3e4b0bb69bc51128b #footer {display:none} /*note*/
where the number is the collection id number for the SqSp page.
(In Firefox: Command-U / Command-F / URL-Slug","id [or "fullurl"]. body id / Enter)
If only header or footer is to be hidden, delete the unwanted line.

 

Does not work---
<style>
nav#main-navigation, #footer-blocks {display:none !important;}
</style>

then if image space remains from header add this afterwards:

<style>
#banner-area{
display:none;
}
</style>

To add a line at the bottom of the header:  Add to that page's Settings in the Advanced section for header code injection.  Only does that one page.  1px is thickness, #ccc is color, padding is length?

<style>
.collection-layout-default #page {
border-top: solid 1px #ccc;
padding: 30px 0 0;
}
</style>