Jump to content

Html Formatting And Mapping With Css


Recommended Posts

Hello everyone,As I am very new to Web Development, I have come across a very simple design.The design for my website is attached as a PDF file that I drew up at work. I scanned it and keeping it for studying purposes. The reason I am posting here is to get clarification on many aspects I am unsure on. Please take a look at the PDF file. If you look at the very top, where the logo would be in the upper most left hand corner; what would this entire section be called?Then take a look at the navigation section, what would this be called?The middle of the page is content, separated by a divider; how is this achieved and what is this called?Last of all, the very bottom of the page where the copyright goes, what is this called?I am going to try and answer my own questions to see if I am even close. The very top of the page is your <header > or <h1> for CSS purposes correct?The left side of the page which is set to repeat-y, or should it be? This is a <table > ? Or in CSS table.one ?As well as your body is a <table >?And your footer is separated with a horizontal divider <hr /> or <div > </div >I put spaces between the brackets so it would show up in this post. Thank you to all who help clarify how I want to arrange my website, and how to communicate between an external CSS file.V/RRob

iofreaks_temp.pdf

Link to post
Share on other sites

1. You might want to check that PDF it was cut off from what I can tell I'm not sure if that was intentional. Because of that and because I'm pretty new to this myself I can't answer all of it.. but I have a few ideas.

Then take a look at the navigation section, what would this be called?
if it's a nav section why not give it a class name like "menu" or "nav"
The middle of the page is content, separated by a divider; how is this achieved and what is this called?
how odd I just went thru my entire history for today (I've been scouring tutorials allday) and I can't find one that explained exactly how to using CSS create a header, footer and three colums.Basically creating the header and footer as simple enough. To achieve the effect of the columns you use float. You float the left colum (width 160). Float the right column (width 160). then for the middle you just create a margin of 200 on both sides so it' doesn't expand into the left and right below the text.. huh.. that tutorial was probably on a floating page. Yep. Here it is
Last of all, the very bottom of the page where the copyright goes, what is this called?
sounds like a footer
Thank you to all who help clarify how I want to arrange my website, and how to communicate between an external CSS file.
well that part is easy You just follow the external style sheet instructions
I put spaces between the brackets so it would show up in this post.
You don't need to do that. You can do it with codeboxes so if you put it like just click on the left where it says "Insert: CODEBOX"
I am going to try and answer my own questions to see if I am even close. The very top of the page is your <header > or <h1> for CSS purposes correct?The left side of the page which is set to repeat-y, or should it be? This is a <table > ? Or in CSS table.one ?As well as your body is a <table >?
The top of the page IS NOT <header>. that is something else entirely. That part won't show up in your page. <h1> is just used to make text larger. You can use it for your header but you don't have to use it ONLY for the header. Edited by wolfkin
Link to post
Share on other sites
here is a link to a page that contains some demo pages for you to inspect/download for learning purposes. You should be able to find one that will allow you to shape the page you are looking for. Good luck, and keep asking questions. We will answer them.
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...