Marking up text

  • 378 views
Uploaded on

Used in support of lecture on marking up text using HTML

Used in support of lecture on marking up text using HTML

More in: Technology , Design
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
    Be the first to like this
No Downloads

Views

Total Views
378
On Slideshare
0
From Embeds
0
Number of Embeds
0

Actions

Shares
Downloads
1
Comments
0
Likes
0

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1.  
  • 2.
    • Domain Names Discussion
    • Symantec Inline Elements
    • Review - using Carlos Fuentes web page
    • Lecture on text markup
    • Resume fixit
    • Generic Elements
  • 3.  
  • 4.
    • Open the PDF file labeled, Instructions for Carlos Fuentes web page .
    • Complete the web page based on these instructions.
  • 5.
    • Open the PDF file labeled, Instructions for Carlos Fuentes web page .
    • Complete the web page based on these instructions.
  • 6.
    • abbr – Abbreviation
    • acronym – Acronym
    • b or strong - Bold text
    • br - Line break
    • cite – Citation
    • code - Computer code
    • i or em - Italic text
    • img - Inline image
    • q - Short quotation
    • Inline elements typically may only contain text and other inline elements. When rendered visually, inline elements do not usually begin on a new line.
  • 7.
    • Open the file resume.txt in NotePad in Windows or TextEdit on Mac
  • 8.
    • Open resume_fixit.html and correct the html
  • 9.
    • Generic HTML elements include the div and span tags.
    • Generic because they are used to divide a document into parts which in turn through the use of identifiers (id and class) be used to style a document in specific ways .
  • 10.
    • Div can be used as a container to group like things together.
      • <div class=”listing”>
        • <img src=”felic1.gif alt=”” />
        • <p><cite>The Complete Manual of Typography</cite>, James Felic</p>
        • <p>a combination of type history with examples </p>
      • </div>
  • 11.
    • Div can be used to break a page into sections for context, structure and layout purposes.
      • <div id=“news”>
        • <h1>News the week</h1>
        • <p> We’ve been working on...</p>
        • <p>And last but not least, ...</p>
      • </div>
  • 12.
    • Span is used for inline elements. Span can only contain text and other inline elements.
      • <ul>
        • <li>Juan <span class=”phone”>999-0202</span></li>
        • <li>Julia <span class=”phone”>888-4889</span></li>
        • <li>Mairo <span class=”phone”>999-3220</span></li>
      • </ul>
  • 13.
    • The id identifier is used only once in a document. Treats the element as if it were data.
      • <div id=”ISBN123456”>
        • <img src=”felic1.gif alt=”” />
        • <p><cite>The Complete Manual of Typography</cite>, James Felic</p>
        • <p>a combination of type history with examples</p>
      • </div>
  • 14.
    • Can also be used to divide a document into parts.
      • <div id=”pageheader”>
        • (masthead and navigation here)
      • </div>
      • <div id=”main”>
        • (main elements here)
      • </div>
      • <div id=”footer”> (copyright info) </div>
  • 15.
    • The class identifier is used for grouping similar elements and can be used multiple times on a page.
      • <div id=”ISBN123456” class= “listing”>
        • <img src=”felic1.gif alt=”” />
        • <p><cite>The Complete Manual of Typography</cite>, James Felic</p>
        • <p>a combination of type history with examples</p>
      • </div>
  • 16.
    • Work through Chapter 5 in Book
    • Assignment: Assume you want to host a web site. Find out what is available, the range of options, how much it would cost.