Style and Lists

1
Style and Lists

• HTML - Chapters 5 and 6

2
Objectives

• Use and distinguish between various style sheets
  and properties
• Create and distinguish between different types of
  lists
• Alter the default bullets for lists

3
(No Transcript)
4
Style Sheets

• A style
• To
• style sheet -

5
Style Sheets

6
Style Sheet Types for HTML

• inline styles
• embedded styles
• linked style sheets in external file and linked
  with the Web site

7
(No Transcript)
8
(No Transcript)
9
Using Inline Styles

• lttag stylestyle declarationsgt
• attribute1value1 attribute2value2

10
Example file
11
Inserting an Inline Style
This figure shows how to insert an inline style.
12
Heading with New Style
This figure shows the heading with the new style.
13
Creating an Embedded Style

• ltstylegt tag between the head tags
• ltstylegt
• selector attribute1value1 attribute2value2
  ...
• lt/stylegt

14
Values of theList-Style-Type Attribute
This figure shows the possible values of the
list-style-type attribute.
15
Style Properties

• Text on page 53
• Link and Anchor page 56
• Color page 57
• MS Training available online
• Do a search for training
• Introduction to cascading style sheets
• From there is a link to HTML for Beginners

16
Creating a Rollover Effect
This figure shows the rollover effect.
17
The class Attribute

• DO NOT USE THE CLASS ATTRIBUTE FOR YOUR
  ASSIGNMENTS!
• THE EXAMPLES IN THE BOOK SHOW HOW TO USE CLASS
  BUT THAT IS NOT THE ONLY WAY TO COMPLETE THE
  TASK.

18
Horizontal Lines

• Created with the lthrgt tag
• Modify color, height, width, alignment
• Specify as
• percentage of available space
• of pixels

19
Exercise

• What will the following code generate?

20
ltheadgt lttitlegt Adding Stylelt/titlegt ltstylegt h1
colorred lt/stylegt lt/headgt ltbodygt lth1
style"text-decorationunderline"gt Let's put a
line at the top of this page lt/h1gt lthrgt ltbrgt lth1gtA
nd another one with different style attributes
here lt/h1gt lthr style"coloraqua
height50pt"gt ltbr/gt lth1gt And a final one of a
different height, length and colorlt/h1gt lthr
style"colorgreen width50 height25px"gt lt/b
odygt lt/htmlgt
21
Creating Lists
22
List Types

• ordered list
• unordered list
• definition list

23
(No Transcript)
24
(No Transcript)
25
(No Transcript)
26
Lists in Action

• http//www.msn.com/

27
(No Transcript)
28
Homework HTML2

• Create a file containing characteristics of your
  current/future/desired web page. You will use an
  ordered list and a definition list. You will use
  inline and embedded styles.
• Specifics on my web site
• Start early so you can get your questions
  answered.

29
Homework Networks - Long Long, chapter 6

• Consider methods to connect to the Internet.
  Research the following local availability
  (company names), max typical connection speed,
  price to connect to the Internet (initial and
  monthly), transmission media (for example twisted
  pair, wireless-microwave, wireless-radio)
• Cellular modems, Internal External modems, DSL,
  cable modems, Satellite, T1/T3

30
Extra Credit Opportunities

• 3-4 minute PowerPoint presentation
• Max of 5 points
• Send presentation to garrisonc_at_winthrop.edu by
  8am on the third day following class (Friday for
  Tuesday classes or Sunday for Thursday classes)

31
Topics Define any unfamiliar terms used in your
presentations.Use your book, other books, the
Internet as sources.

• Identify the reasons to create a home network.
  Tell how to connect a home network. Include
  hardware, software, costs.
• Define client/server and peer-to-peer networks.
  Identify differences between them? Where are they
  used? Distinguish client from server.
• Discuss the advantages and disadvantages of
  wireless networks. How are they created? What are
  the types of wireless networks?