Embedded navbar/background image

I am trying to make a navbar, background, and style consistent through a few paged site. I have done a bit of research and found I might be able to use a server side include or the link property to embed a page in all the pages so I can change once and feel the effects on all the pages, I found the way to change the background is to add it to the body tag, but shouldn’t the body tag be separate from the embedded file? I considered opening the body tag in the template file and closing it in each individual page, but that seems very bad.

Here is my unfinished template file.

body { background-color: #afa7a7; color: white; .button { background-color: #424242; color: white; border:none; padding 15px 20px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px; 2px; cursor: pointer; } <body Pentagram Pentagram

I’m not entirely sure how an embedded file works. (I haven’t got there yet.)

What if instead of doing that, you make a separate CSS file and change the body style there, and link each file to the CSS sheet? Or say you have 7 pages but only want 6 of them to use that background, you could create an id or class in the CSS sheet, and apply the id or class to whichever body tags you want it on.