SlideShare une entreprise Scribd logo
1  sur  22
<
        < HTML
        Lesson 2: Getting To Know HTML

By Olivia Moran




[Codo Dojo – HTML Group Sligo, Ireland]
liviamoran.me
www.oliviamoran.me
http://www.slideshare.net/oliviamoran
HTML Consists
     of
  <tags>
What tags have we
 learned so far?
    <html>
    <body>
    <title>
     <h1>
     <p>
The tags that we have so
     far learned have
opening and closing tags
Some tags do not have a
closing tag. They stand
 alone. For example:
         <br>
         <hr>
BR Tag
                    BR Tag

                    What is it?

• The <br> tag inserts a single line break.
• The <br> tag is an empty tag which means that it
  has no end tag.
<html>
<body>
<p>This is<br>
a para<br>graph with
line breaks</p>
</body>
</html>
HR Tag
                    HR Tag

                    What is it?

• The <hr> tag cretes a break in an HTML page (e.g. a
  new topic).
• The <hr> element is used to separate content (or
  define a change) in an HTML page.
<html>
<body>
<h1>HTML</h1>
<p>HTML is a language for describing
web pages.</p>
<hr>
<h1>CSS</h1>
<p>CSS defines how to display HTML
elements.</p>
</body>
</html>
Some tags have attributes
i.e. additional options.
Attributes have to
have values. Values should
be enclosed in quotation marks.
Font Attributes

    •Face
     •Size
   •Colour
html>
<body>
<p><font size="3" color="red">This is
some text!</font></p>
<p><font size="2" color="blue">This is
some text!</font></p>
<p><font face="verdana"
color="green">This is some text!
</font></p>
</body>
</html>
Text Formatting
      Tags
<html>
<body>
<p><b>This text is bold</b></p>
<p><big>This text is big</big></p>
<p><i>This text is italic</i></p>
<p>This is<sub> subscript</sub> and
<sup>superscript</sup></p>
</body>
</html>
Text Formatting
      Tags
Bold, Italic Etc
<html>
<body>
<p><b>This text is bold</b></p>
<p><big>This text is big</big></p>
<p><i>This text is italic</i></p>
<p>This is<sub> subscript</sub> and
<sup>superscript</sup></p>
</body>
</html>
U, Strike, Sub Etc
<html><body>
<p><u>Underline Me!</u></p>
<p><strike>Strike Your Out!</strike></p>
<p><center>This centers text on the
page</center></p>
<p>This is<sub> subscript</sub> and
<sup>superscript</sup></p>
<p><b> <i> I am bold AND Italic, which
makes me cool!</i> </b></p>
</body></html>
Font Sizes
<html>
<body>
<p><font size="+1">Here is a size 4
font</font></p>
<p><font size="-1">Here is a size 2
font</font></p>
<p><font size="+2">Here is a size 5
font</font></p>
</body>
</html>
<html><body>                   Font Color

 <p> <font color="pink">This text is
pink</font><br/>
<font color="#FF6666">This text is also
pink</font></p>


<p><font color="green">This text is
green</font><br/>
<font color="#339900">This text is also
green</font></p>


</body></html>
Font Face
<html><body>

<p><font face="Verdana">This
paragraph uses verdana
text.</font></p>

<p><font face="Arial"> This paragraph
uses arial text.</font></p>

<p><font face="Bookman Old Style,
Book Antiqua, Garamond">This
paragraph gives alternatives.</font><p>

</body></html>
Putting It All
<html><body>                    Together

<font size="+4"><b>Hey
There</b></font><br/>

<font face="verdana” size="4”
color="pink”><i>The font is really cool.
It lets me</i> </font>

<p><font size="7" face="Georgia, Arial"
color="maroon">C</font>customize my
font to achieve a desired look.</p>

</body></html>

Contenu connexe

Tendances

Tendances (20)

HTML Lesson 1
HTML Lesson 1HTML Lesson 1
HTML Lesson 1
 
How to create basic webpage
How to create basic webpageHow to create basic webpage
How to create basic webpage
 
Artistic Web Applications - Week3 - Part 3
Artistic Web Applications - Week3 - Part 3Artistic Web Applications - Week3 - Part 3
Artistic Web Applications - Week3 - Part 3
 
1. html introduction
1. html introduction1. html introduction
1. html introduction
 
Creating your first web page
Creating your first web pageCreating your first web page
Creating your first web page
 
Lecture-3: Introduction to html - Basic Structure & Block Building
Lecture-3: Introduction to html - Basic Structure & Block BuildingLecture-3: Introduction to html - Basic Structure & Block Building
Lecture-3: Introduction to html - Basic Structure & Block Building
 
Web design - HTML (Hypertext Markup Language) introduction
Web design - HTML (Hypertext Markup Language) introductionWeb design - HTML (Hypertext Markup Language) introduction
Web design - HTML (Hypertext Markup Language) introduction
 
Html
HtmlHtml
Html
 
How the Web Works Using HTML
How the Web Works Using HTMLHow the Web Works Using HTML
How the Web Works Using HTML
 
How to Make HTML and CSS Files
How to Make HTML and CSS FilesHow to Make HTML and CSS Files
How to Make HTML and CSS Files
 
Intro to HTML & CSS
Intro to HTML & CSSIntro to HTML & CSS
Intro to HTML & CSS
 
Html.ppt
Html.pptHtml.ppt
Html.ppt
 
Htmlcss1
Htmlcss1Htmlcss1
Htmlcss1
 
Basic Webpage
Basic WebpageBasic Webpage
Basic Webpage
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
HTML CSS and Web Development
HTML CSS and Web DevelopmentHTML CSS and Web Development
HTML CSS and Web Development
 
Basics of HTML
Basics of HTMLBasics of HTML
Basics of HTML
 
Artistic Web Applications - Week3 - Part 1
Artistic Web Applications - Week3 - Part 1Artistic Web Applications - Week3 - Part 1
Artistic Web Applications - Week3 - Part 1
 
Week 5 Lecture
Week 5 LectureWeek 5 Lecture
Week 5 Lecture
 
Learning HTML
Learning HTMLLearning HTML
Learning HTML
 

En vedette

Note120110829
Note120110829Note120110829
Note120110829pyramid0
 
Galbreath. B.D. Owens Library
Galbreath. B.D. Owens LibraryGalbreath. B.D. Owens Library
Galbreath. B.D. Owens LibraryLeslie Galbreath
 
Complexity Versus Comprehendability: Simplifying Wireless Security
Complexity Versus Comprehendability: Simplifying Wireless SecurityComplexity Versus Comprehendability: Simplifying Wireless Security
Complexity Versus Comprehendability: Simplifying Wireless SecurityOlivia Moran
 
Expose ouverturexpi sept-2009-settat-1
Expose ouverturexpi sept-2009-settat-1Expose ouverturexpi sept-2009-settat-1
Expose ouverturexpi sept-2009-settat-1pyramid0
 
Baseline Brainwave Biometrics
Baseline Brainwave BiometricsBaseline Brainwave Biometrics
Baseline Brainwave BiometricsOlivia Moran
 
Knowledge Management: A Literature Review
Knowledge Management: A Literature ReviewKnowledge Management: A Literature Review
Knowledge Management: A Literature ReviewOlivia Moran
 
Top Tips For Creating A Great CV
Top Tips For Creating A Great CVTop Tips For Creating A Great CV
Top Tips For Creating A Great CVOlivia Moran
 
Basic Html Tags Tutorial For Kids
Basic Html Tags Tutorial For KidsBasic Html Tags Tutorial For Kids
Basic Html Tags Tutorial For KidsOlivia Moran
 
Biometrics Iris Scanning: A Literature Review
Biometrics Iris Scanning: A Literature ReviewBiometrics Iris Scanning: A Literature Review
Biometrics Iris Scanning: A Literature ReviewOlivia Moran
 

En vedette (13)

Storyboard
StoryboardStoryboard
Storyboard
 
Note120110829
Note120110829Note120110829
Note120110829
 
Portafolio influencias
Portafolio influenciasPortafolio influencias
Portafolio influencias
 
Galbreath. B.D. Owens Library
Galbreath. B.D. Owens LibraryGalbreath. B.D. Owens Library
Galbreath. B.D. Owens Library
 
Complexity Versus Comprehendability: Simplifying Wireless Security
Complexity Versus Comprehendability: Simplifying Wireless SecurityComplexity Versus Comprehendability: Simplifying Wireless Security
Complexity Versus Comprehendability: Simplifying Wireless Security
 
Expose ouverturexpi sept-2009-settat-1
Expose ouverturexpi sept-2009-settat-1Expose ouverturexpi sept-2009-settat-1
Expose ouverturexpi sept-2009-settat-1
 
Baseline Brainwave Biometrics
Baseline Brainwave BiometricsBaseline Brainwave Biometrics
Baseline Brainwave Biometrics
 
Mai
MaiMai
Mai
 
Portafolio influencias
Portafolio influenciasPortafolio influencias
Portafolio influencias
 
Knowledge Management: A Literature Review
Knowledge Management: A Literature ReviewKnowledge Management: A Literature Review
Knowledge Management: A Literature Review
 
Top Tips For Creating A Great CV
Top Tips For Creating A Great CVTop Tips For Creating A Great CV
Top Tips For Creating A Great CV
 
Basic Html Tags Tutorial For Kids
Basic Html Tags Tutorial For KidsBasic Html Tags Tutorial For Kids
Basic Html Tags Tutorial For Kids
 
Biometrics Iris Scanning: A Literature Review
Biometrics Iris Scanning: A Literature ReviewBiometrics Iris Scanning: A Literature Review
Biometrics Iris Scanning: A Literature Review
 

Similaire à Lesson 2: Getting To Know HTML

Html ppt by Fathima faculty Hasanath college for women bangalore
Html ppt by Fathima faculty Hasanath college for women bangaloreHtml ppt by Fathima faculty Hasanath college for women bangalore
Html ppt by Fathima faculty Hasanath college for women bangalorefathima12
 
HTML practical guide for O/L exam
HTML practical guide for O/L examHTML practical guide for O/L exam
HTML practical guide for O/L examAnne Perera
 
Html basics-auro skills
Html basics-auro skillsHtml basics-auro skills
Html basics-auro skillsBoneyGawande
 
Basics of html for web development by software outsourcing company india
Basics of html for web development   by software outsourcing company indiaBasics of html for web development   by software outsourcing company india
Basics of html for web development by software outsourcing company indiaJignesh Aakoliya
 
Basic HTML
Basic HTMLBasic HTML
Basic HTMLSayan De
 
Html notes with Examples
Html notes with ExamplesHtml notes with Examples
Html notes with Examplesisha
 
SDP_HTML.pptx
SDP_HTML.pptxSDP_HTML.pptx
SDP_HTML.pptxVani011
 
Basic Html Knowledge for students
Basic Html Knowledge for studentsBasic Html Knowledge for students
Basic Html Knowledge for studentsvethics
 
learnhtmlbyvipuladissanayake-170516061515 (1).pptx
learnhtmlbyvipuladissanayake-170516061515 (1).pptxlearnhtmlbyvipuladissanayake-170516061515 (1).pptx
learnhtmlbyvipuladissanayake-170516061515 (1).pptxManuAbraham17
 
Chapter 6 html
Chapter 6 htmlChapter 6 html
Chapter 6 htmlhome
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTMLAmeer Khan
 
Learn html Basics
Learn html BasicsLearn html Basics
Learn html BasicsMcSoftsis
 

Similaire à Lesson 2: Getting To Know HTML (20)

Html ppt by Fathima faculty Hasanath college for women bangalore
Html ppt by Fathima faculty Hasanath college for women bangaloreHtml ppt by Fathima faculty Hasanath college for women bangalore
Html ppt by Fathima faculty Hasanath college for women bangalore
 
HTML practical guide for O/L exam
HTML practical guide for O/L examHTML practical guide for O/L exam
HTML practical guide for O/L exam
 
Learn HTML Easier
Learn HTML EasierLearn HTML Easier
Learn HTML Easier
 
Standard html tags
Standard html tagsStandard html tags
Standard html tags
 
Html basics-auro skills
Html basics-auro skillsHtml basics-auro skills
Html basics-auro skills
 
Html
HtmlHtml
Html
 
Basics of html for web development by software outsourcing company india
Basics of html for web development   by software outsourcing company indiaBasics of html for web development   by software outsourcing company india
Basics of html for web development by software outsourcing company india
 
Html (1)
Html (1)Html (1)
Html (1)
 
Basic HTML
Basic HTMLBasic HTML
Basic HTML
 
Html notes with Examples
Html notes with ExamplesHtml notes with Examples
Html notes with Examples
 
SDP_HTML.pptx
SDP_HTML.pptxSDP_HTML.pptx
SDP_HTML.pptx
 
Basic Html Knowledge for students
Basic Html Knowledge for studentsBasic Html Knowledge for students
Basic Html Knowledge for students
 
learnhtmlbyvipuladissanayake-170516061515 (1).pptx
learnhtmlbyvipuladissanayake-170516061515 (1).pptxlearnhtmlbyvipuladissanayake-170516061515 (1).pptx
learnhtmlbyvipuladissanayake-170516061515 (1).pptx
 
Chapter 6 html
Chapter 6 htmlChapter 6 html
Chapter 6 html
 
HTML.pptx
HTML.pptxHTML.pptx
HTML.pptx
 
Introduction to HTML
Introduction to HTMLIntroduction to HTML
Introduction to HTML
 
Learn html Basics
Learn html BasicsLearn html Basics
Learn html Basics
 
Html ppt
Html pptHtml ppt
Html ppt
 
HTML Introduction
HTML IntroductionHTML Introduction
HTML Introduction
 
Html Workshop
Html WorkshopHtml Workshop
Html Workshop
 

Plus de Olivia Moran

Olivia Moran, my linked in recommendations
Olivia Moran, my linked in recommendationsOlivia Moran, my linked in recommendations
Olivia Moran, my linked in recommendationsOlivia Moran
 
Lesson 3: Linking It All Together
Lesson 3: Linking It All Together Lesson 3: Linking It All Together
Lesson 3: Linking It All Together Olivia Moran
 
Social Media Strategy
Social Media StrategySocial Media Strategy
Social Media StrategyOlivia Moran
 
E-Learning @ The Library
E-Learning @ The LibraryE-Learning @ The Library
E-Learning @ The LibraryOlivia Moran
 
The E-Tutor: A Jack Of All Trades
The E-Tutor: A Jack Of All TradesThe E-Tutor: A Jack Of All Trades
The E-Tutor: A Jack Of All TradesOlivia Moran
 
Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?
Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?
Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?Olivia Moran
 
Self Organisation: Inspiring Neural Network & IT Design
Self Organisation: Inspiring Neural Network & IT DesignSelf Organisation: Inspiring Neural Network & IT Design
Self Organisation: Inspiring Neural Network & IT DesignOlivia Moran
 
Project Management: A Critical Examination of the PPARS Project
Project Management: A Critical Examination of the PPARS ProjectProject Management: A Critical Examination of the PPARS Project
Project Management: A Critical Examination of the PPARS ProjectOlivia Moran
 
Brainwave Feature Extraction, Classification & Prediction
Brainwave Feature Extraction, Classification & PredictionBrainwave Feature Extraction, Classification & Prediction
Brainwave Feature Extraction, Classification & PredictionOlivia Moran
 

Plus de Olivia Moran (12)

Olivia Moran, my linked in recommendations
Olivia Moran, my linked in recommendationsOlivia Moran, my linked in recommendations
Olivia Moran, my linked in recommendations
 
Lesson 3: Linking It All Together
Lesson 3: Linking It All Together Lesson 3: Linking It All Together
Lesson 3: Linking It All Together
 
E-College
E-CollegeE-College
E-College
 
Social Media Strategy
Social Media StrategySocial Media Strategy
Social Media Strategy
 
E-Learning @ The Library
E-Learning @ The LibraryE-Learning @ The Library
E-Learning @ The Library
 
Blended Learning
Blended LearningBlended Learning
Blended Learning
 
What is Moodle
What is MoodleWhat is Moodle
What is Moodle
 
The E-Tutor: A Jack Of All Trades
The E-Tutor: A Jack Of All TradesThe E-Tutor: A Jack Of All Trades
The E-Tutor: A Jack Of All Trades
 
Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?
Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?
Technology Infrastructure For The Pervasive Vision, Does It Exist Yet?
 
Self Organisation: Inspiring Neural Network & IT Design
Self Organisation: Inspiring Neural Network & IT DesignSelf Organisation: Inspiring Neural Network & IT Design
Self Organisation: Inspiring Neural Network & IT Design
 
Project Management: A Critical Examination of the PPARS Project
Project Management: A Critical Examination of the PPARS ProjectProject Management: A Critical Examination of the PPARS Project
Project Management: A Critical Examination of the PPARS Project
 
Brainwave Feature Extraction, Classification & Prediction
Brainwave Feature Extraction, Classification & PredictionBrainwave Feature Extraction, Classification & Prediction
Brainwave Feature Extraction, Classification & Prediction
 

Dernier

18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdfssuser54595a
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdfSoniaTolstoy
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introductionMaksud Ahmed
 
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxPOINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxSayali Powar
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfUmakantAnnand
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformChameera Dedduwage
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityGeoBlogs
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
Presiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha electionsPresiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha electionsanshu789521
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAssociation for Project Management
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersChitralekhaTherkar
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13Steve Thomason
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3JemimahLaneBuaron
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991RKavithamani
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...EduSkills OECD
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)eniolaolutunde
 
Mastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory InspectionMastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory InspectionSafetyChain Software
 
mini mental status format.docx
mini    mental       status     format.docxmini    mental       status     format.docx
mini mental status format.docxPoojaSen20
 

Dernier (20)

18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
 
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdfBASLIQ CURRENT LOOKBOOK  LOOKBOOK(1) (1).pdf
BASLIQ CURRENT LOOKBOOK LOOKBOOK(1) (1).pdf
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introduction
 
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptxPOINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
POINT- BIOCHEMISTRY SEM 2 ENZYMES UNIT 5.pptx
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.Compdf
 
A Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy ReformA Critique of the Proposed National Education Policy Reform
A Critique of the Proposed National Education Policy Reform
 
Paris 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activityParis 2024 Olympic Geographies - an activity
Paris 2024 Olympic Geographies - an activity
 
Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
Staff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSDStaff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSD
 
Presiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha electionsPresiding Officer Training module 2024 lok sabha elections
Presiding Officer Training module 2024 lok sabha elections
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
 
Micromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of PowdersMicromeritics - Fundamental and Derived Properties of Powders
Micromeritics - Fundamental and Derived Properties of Powders
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
 
Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)Software Engineering Methodologies (overview)
Software Engineering Methodologies (overview)
 
Mastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory InspectionMastering the Unannounced Regulatory Inspection
Mastering the Unannounced Regulatory Inspection
 
mini mental status format.docx
mini    mental       status     format.docxmini    mental       status     format.docx
mini mental status format.docx
 

Lesson 2: Getting To Know HTML

  • 1. < < HTML Lesson 2: Getting To Know HTML By Olivia Moran [Codo Dojo – HTML Group Sligo, Ireland] liviamoran.me www.oliviamoran.me http://www.slideshare.net/oliviamoran
  • 2. HTML Consists of <tags>
  • 3. What tags have we learned so far? <html> <body> <title> <h1> <p>
  • 4. The tags that we have so far learned have opening and closing tags
  • 5. Some tags do not have a closing tag. They stand alone. For example: <br> <hr>
  • 6. BR Tag BR Tag What is it? • The <br> tag inserts a single line break. • The <br> tag is an empty tag which means that it has no end tag.
  • 7. <html> <body> <p>This is<br> a para<br>graph with line breaks</p> </body> </html>
  • 8. HR Tag HR Tag What is it? • The <hr> tag cretes a break in an HTML page (e.g. a new topic). • The <hr> element is used to separate content (or define a change) in an HTML page.
  • 9. <html> <body> <h1>HTML</h1> <p>HTML is a language for describing web pages.</p> <hr> <h1>CSS</h1> <p>CSS defines how to display HTML elements.</p> </body> </html>
  • 10. Some tags have attributes i.e. additional options.
  • 11. Attributes have to have values. Values should be enclosed in quotation marks.
  • 12. Font Attributes •Face •Size •Colour
  • 13. html> <body> <p><font size="3" color="red">This is some text!</font></p> <p><font size="2" color="blue">This is some text!</font></p> <p><font face="verdana" color="green">This is some text! </font></p> </body> </html>
  • 15. <html> <body> <p><b>This text is bold</b></p> <p><big>This text is big</big></p> <p><i>This text is italic</i></p> <p>This is<sub> subscript</sub> and <sup>superscript</sup></p> </body> </html>
  • 17. Bold, Italic Etc <html> <body> <p><b>This text is bold</b></p> <p><big>This text is big</big></p> <p><i>This text is italic</i></p> <p>This is<sub> subscript</sub> and <sup>superscript</sup></p> </body> </html>
  • 18. U, Strike, Sub Etc <html><body> <p><u>Underline Me!</u></p> <p><strike>Strike Your Out!</strike></p> <p><center>This centers text on the page</center></p> <p>This is<sub> subscript</sub> and <sup>superscript</sup></p> <p><b> <i> I am bold AND Italic, which makes me cool!</i> </b></p> </body></html>
  • 19. Font Sizes <html> <body> <p><font size="+1">Here is a size 4 font</font></p> <p><font size="-1">Here is a size 2 font</font></p> <p><font size="+2">Here is a size 5 font</font></p> </body> </html>
  • 20. <html><body> Font Color <p> <font color="pink">This text is pink</font><br/> <font color="#FF6666">This text is also pink</font></p> <p><font color="green">This text is green</font><br/> <font color="#339900">This text is also green</font></p> </body></html>
  • 21. Font Face <html><body> <p><font face="Verdana">This paragraph uses verdana text.</font></p> <p><font face="Arial"> This paragraph uses arial text.</font></p> <p><font face="Bookman Old Style, Book Antiqua, Garamond">This paragraph gives alternatives.</font><p> </body></html>
  • 22. Putting It All <html><body> Together <font size="+4"><b>Hey There</b></font><br/> <font face="verdana” size="4” color="pink”><i>The font is really cool. It lets me</i> </font> <p><font size="7" face="Georgia, Arial" color="maroon">C</font>customize my font to achieve a desired look.</p> </body></html>