chapter 2
Skip this Video
Download Presentation
Chapter 2

Loading in 2 Seconds...

play fullscreen
1 / 21

Chapter 2 - PowerPoint PPT Presentation

  • Uploaded on

Chapter 2. Adding and Formatting Text. Agenda. Creating a Paragraph Adding a Line Break Inserting a Blank Space Inserting Preformatted Text Inserting Headings Adding Block Quotes Inserting a Comment Creating Lists (Numbered, Bulleted and Nested) Creating a Definition List

I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
Download Presentation

PowerPoint Slideshow about 'Chapter 2' - halden

An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
chapter 2

Chapter 2

Adding and Formatting Text

  • Creating a Paragraph
  • Adding a Line Break
  • Inserting a Blank Space
  • Inserting Preformatted Text
  • Inserting Headings
  • Adding Block Quotes
  • Inserting a Comment
  • Creating Lists (Numbered, Bulleted and Nested)
  • Creating a Definition List
  • Inserting Special Characters
  • Font Styles (Bold, Italic, Underline)
  • Formatting Fonts (Name, Size, Color)
  • Adjusting Margins
  • Setting a Background Page Color
  • Adding a Horizontal Line
creating a paragraph
Creating a Paragraph
  • The

    tag defines a paragraph.

  • Browsers automatically add some space (margin) before and after each



This is some text in a paragraph.

adding a line break
Adding a Line Break
  • The
    tag inserts a single line break.
  • The
    tag is an empty tag which means that it has no end tag.
  • The
    tag is useful for writing addresses or poems.
  • Use the
    tag to enter line breaks, not to separate paragraphs.


This text contains
a line break.

inserting a blank space
Inserting a Blank Space
  • Insert the HTML entity   where ever you would like to add a single space ("nbsp" stands for non breaking space).
  • Using   is helpful in situations where you just need one or two spaces in between characters or words.


Hello.  How are you

inserting preformatted text
Inserting Preformatted Text
  • The
     tag defines preformatted text.
  • Text in a
     element is displayed in a fixed-width font (usually Courier), and it preserves both spaces and line breaks.

Tip: Use the

 element when displaying text with unusual formatting, or some sort of computer code.


Text in a pre elementis displayed in a fixed-widthfont, and it preservesboth 				spaces andline breaks

inserting headings
Inserting Headings
  • The


    tags are used to define HTML headings.
  • defines the most important heading.

    defines the least important heading.


This is heading 1

This is heading 2

This is heading 3

This is heading 4

This is heading 5
This is heading 6

adding block quotes
Adding Block Quotes
  • The
    tag specifies a section that is quoted from another source.


For 50 years, WWF has been protecting the future of nature. The world’s leading conservation organization, WWF works in 100 countries and is supported by 1.2 million members in the United States and close to 5 million globally.

inserting a comment
Inserting a Comment
  • The comment tag is used to insert comments in the source code. Comments are not displayed in the browsers.
  • You can use comments to explain your code, which can help you when you edit the source code at a later date. This is especially useful if you have a lot of code.


creating numbered lists
Creating Numbered Lists
  • The
      tag defines an ordered list. An ordered list can be numerical or alphabetical.
    1. Use the
    2. tag to define list items.
example of o rdered list
Example of Ordered List

  1. Coffee
  2. Tea
  3. Milk
  1. Coffee
  2. Tea
  3. Milk

creating bulleted lists
Creating Bulleted Lists
  • The
      tag defines an unordered (bulleted) list.
    • Use the
        tag together with the
      • tag to create unordered lists.
example of bulleted list
Example of Bulleted List

  • Coffee
  • Tea
  • Milk

  • Coffee
  • Tea
  • Milk

creating a definition list
Creating a Definition List
  • The
    tag defines a description list.
  • The
    tag is used in conjunction with
    (defines terms/names) and
    (describes each term/name).


Black hot drink
White cold drink

font styles bold italic underline
Font Styles (Bold, Italic, Underline)

The tag specifies bold text.

The tag specifies italic text.

The tag specifies underlined text.


This is normal text - and this is bold text

This is normal text - and this is bold text

This is normal text - and this is bold text

formatting fonts
Formatting Fonts

The tag specifies the font face, font size, and font color of text.


This is some text!This is some text!This is some text!

adjusting margins
Adjusting Margins
  • LEFTMARGIN - Sets a left hand margin for your body element.
  • TOPMARGIN - Sets a margin along the top of your body element.
  • A unique set of margin attributes are available to the body tag. These attributes work much like those of a word processing program, allowing you set pixel value margins for the left, right, top, or bottom of your website. Setting these attributes means that all the content you place within your body tags will honor the preset margin.


the body tag
The tag

The tag defines the document's body.

The element contains all the contents of an HTML document, such as text, hyperlinks, images, tables, lists, etc.

adding a horizontal line
Adding a Horizontal Line
  • The
    tag defines a thematic break in an HTML page (e.g. a shift of topic).
  • The
    element is used to separate content (or define a change) in an HTML page.



HTML is a language for describing web pages.....


CSS defines how to display HTML elements.....

lab 2
Lab 2

Write an HTML code that contains the following:

  • Paragraphs with different alignments
  • Line Breaks
  • Blank Spaces
  • Headings (h1, h2, h3, h4, h5, h6)
  • Comments
  • Lists (Numbered, Bulleted)
  • Font Styles (Bold, Italic, Underline)
  • Fonts (Name, Size, Color)
  • Margins
  • Background Page Color
  • Horizontal Line