PAGE LAYOUT - 1

 Most HTML elements are defined as block level elements or inline elements.  Block level elements normally start (and end) with a new line, when displayed in a browser. Examples:,,,,, etc.  Inline elements are normally displayed without line breaks. Examples:,,,,, etc.

 Example - Block TE 311: Website Design and Administration This course is intended to teach students how to design pages… Note that this line started on a new line

 Example - Block Block Elements HTML block elements are those that always start on new line Paragraph is a block element This is another paragraph

 Example - Inline Inline Elements HTML inline elements are those that normally display without line breaks unless end of display area reached… This line breaks only if it is longer than available area. This bold sentence will not begin on new line, rather continue on the previous. So is this italic one So is this link as well!

 These are tags used to group content together either to position them somewhere on the page (div) or apply a certain treatment (div,span).  - Defines a section in a document (block- level)  - Defines a section in a document (inline). Usually, is used to span inline elements as opposed to block elements. CSS rules are used to create a visual effect for a span.

 Example - Div tag My Important Heading Note that, the style has applied only to the spanned area Cell one of row one

 Example - Spanning tag My Important Heading Note that, the style has applied only to the spanned area

 Example - Spanning tag This is the first paragraph. Its contents has been justified as set by the surrounding span tag. Everything within the span will be treated with the same style unless overridden by other CSS rules Another paragraph. This also has been justified as dictated by the spanning span

 The most rudimentary means laying out content on a page is by using a basic HTML table.  This was the first means employed to arrange content on the web before the div tag was introduced.

 The most rudimentary means laying out content on a page is by using a basic HTML table.  This was the first means employed to arrange content on the web before the div tag was introduced.

 Example – Using basic table Layout with tables Welcome to Table Page Layout Here is left side of the page. Some content can be placed here Middle section of page. Some content can also go here. This makes up the main display section of your page. Some right pane content of your page. Second left side section. Footer part of the page.

 Example – Table tweaked with style Layout with tables Welcome to Table Page Layout Here is left side of the page. Some content can be placed here Middle section of page. Some content can also go here. This makes up the main display section of your page. Some right pane content of your page. Second left side section. Footer part of the page.