SlideShare ist ein Scribd-Unternehmen logo
1 von 23
Session No 3

Developed by: Saif Ullah Dar

1/7/2014

1
1.
2.
3.
4.
5.
6.
7.
8.
9.

LOGICAL CHARACTER HIGHLIGHTING TAGS
PHYSICAL CHARACTER HIGHLIGHTING TAGS
FONT TAG
FONT TAG PROPERTIES.
SIZE OF FONT
COLOR OF FONT
FACE OF FONT
SPECIAL CHARACTERS
USING LINKS

Developed by: Saif Ullah Dar

1/7/2014

2
•
•

•
•

Logical Character Highlighters are also
known as Idiomatic styles tags.
The purpose of logical tags is to convey
the basic semantic meaning of a piece of
text rather than the absolute appearance.
It is used to give your text a different look
when displayed by browsers.
Browser handle the look and feel of the
logical tag.

Developed by: Saif Ullah Dar

1/7/2014

3
•
•

•

Physical Character Highlighters are also
known as Typographical styles tags.
It is used to give your text a different look
but exacting look.
Not all browsers support physical styles.

Developed by: Saif Ullah Dar

1/7/2014

4
• It is used to change the font color, f

ontsize,

font face of text in an HTML document.

Developed by: Saif Ullah Dar

1/7/2014

5
A. SIZE

B. COLOR
C. FACE

Developed by: Saif Ullah Dar

1/7/2014

6
The primary <FONT> attribute is SIZE=x,
where x is an absolute value ranging from 1
to 7 or a relative vale (+/-).
Default font size is 3.
Largest font size can be set is 7.
Smallest is 1.

Developed by: Saif Ullah Dar

1/7/2014

7
There are 3 different methods to set color.

i.

Generic Coloring System

ii.

RGB Coloring System

iii.

Hexadecimal Coloring System

Developed by: Saif Ullah Dar

1/7/2014

8
1) Generics colors are preset HTML coded colors
where the

2)

value is simply the name of each color.

Developed by: Saif Ullah Dar

1/7/2014

9
Black

Gray

Silver

White

Yellow

Lime

Aqua

Fuchsia

Red

Green

Blue

Purple

Maroon

Olive

Navy

Teal

Developed by: Saif Ullah Dar

1/7/2014

10
I. RGB stands for Red, Green, Blue. Each can
have a value from 0 (none of that color) to
255 (fully that color).

II.

The format for RGB is – RGB (Red, Green,
Blue)

Developed by: Saif Ullah Dar

1/7/2014

11
<font color=RGB(255,0,0)>Confidence</font>

Confidence

<font color=RGB(255,255,0)>Confidence</font>

Confidence

<font color=RGB(0,0,255)>Confidence</font>

Confidence

<font color=RGB(255,255,255)>Confidence</font>

Confidence

Developed by: Saif Ullah Dar

1/7/2014

12
A hexadecimal is a 6 digit representation of a
color.

XX

XX

XX

Red

Green

Blue

Developed by: Saif Ullah Dar

1/7/2014

13
<font color=“#FF0000”>Confidence</font>

Confidence

<font color=“#FFFF00”>Confidence</font>

Confidence

<font color=“#0000FF”>Confidence</font>

Confidence

<font color=“#FFFFFF”>Confidence</font>

Confidence

Developed by: Saif Ullah Dar

1/7/2014

14
Color

Color
Name

Hexadecim
al Value

Color
Name

Hexadecima
l Value

Black

#000000

Green

#008000

Silver

#c0c0c0

Lime

#00ff00

Gray

#808080

Olive

#808000

White

#ffffff

Yellow

#ffff00

Maroo
n

#800000

Navy

#000080

Red

#ff0000

Blue

#0000ff

Purple #800080

Teal

#008080

Fushia #ff00ff

Aqua

#00ffff

Developed by: Saif Ullah Dar

Color

1/7/2014

15
The font face attribute is used to specify
the font name.

Developed by: Saif Ullah Dar

1/7/2014

16
<font face=“Serif”>Confidence</font>

Confidence

<font face=“Courier”>Confidence</font>

Confidence

<font face=“Palatino”>Confidence</font>

Confidence

<font face=“Monotype Corsiva”>Confidence</font>

Confidence

Developed by: Saif Ullah Dar

1/7/2014

17
<html>
<body>
<h2><b>&lt;MARQUEE&gt;</b> is used to scroll the
enclosing text.</h2>

</body>
</html>

Developed by: Saif Ullah Dar

1/7/2014

18
 The

Anchor Tag



HTML uses the <a> (anchor) tag to create a link to another document.



Attributes of <a>(anchor) tag

href : is used to address the document to link to, and
the words between the open and close of the anchor
tag will be displayed as a hyperlink.
Syntax:
<a href=”url”>Text to be displayed</a>


Developed by: Saif Ullah Dar

1/7/2014

19


Attributes of <a>(anchor) tag
target : The target attribute defines where the linked
document will be opened.
Syntax:
<a href=“http://w3.ibm.com” target=“where to place
the document”>Text to be displayed</a>
 name :The name attribute is used to create a named
anchor. When using named anchors we can create links
that can jump directly into a specific section on a
page.


Syntax
<a name=“label”>Text to be displayed</a>

Developed by: Saif Ullah Dar

1/7/2014

20
---- other information within
<html>
body tag------<head>
</body>
<title>Example of a
</html>
Hyperlink</title>
<head>
The word IBM will be highlighted , and
<body>
on clicking IBM the user will be taken to
the w3 pages of IBM, the page will be
<a href=“http://w3.IBM.com”>
opened on the same window
IBM</a>
<a href=“http://w3.IBM.com”
The word IBM will be highlighted , and
target=“_blank”>IBM</a>
on clicking IBM the user will be taken to
the w3 pages of IBM, the page will be
opened on a new window.

Developed by: Saif Ullah Dar

1/7/2014

21
</body>
</html>

<html>
<body>

<a name=“locations”>
locations</a>
Kolkata, Lahore,Karachi,
Dhaka, Kabul, Tehran
----- other information
On Clicking on IBM Location in Asia you
will be linked to the section which has
been named as locations

---------<a href=“#locations”>IBM
Location In Asia</a>

Developed by: Saif Ullah Dar

1/7/2014

22
SAIF ULLAH DAR

Developed by: Saif Ullah Dar

1/7/2014

23

Weitere ähnliche Inhalte

Ähnlich wie Session no 3

In Class Assignment 1 .docx
In Class Assignment 1                                        .docxIn Class Assignment 1                                        .docx
In Class Assignment 1 .docx
jaggernaoma
 
Html xhtml tag-sheet
Html xhtml tag-sheetHtml xhtml tag-sheet
Html xhtml tag-sheet
wihrbt
 
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities:  Leveraging the Power of the Adobe Web Pub...Familiar Tools, New Possibilities:  Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
John Hartley
 

Ähnlich wie Session no 3 (20)

Intro to html revised2
Intro to html revised2Intro to html revised2
Intro to html revised2
 
Web engineering and Technology
Web engineering and TechnologyWeb engineering and Technology
Web engineering and Technology
 
Session no 2
Session no 2Session no 2
Session no 2
 
Session no 1
Session no 1Session no 1
Session no 1
 
Html.pptx
Html.pptxHtml.pptx
Html.pptx
 
Session no 4
Session no 4Session no 4
Session no 4
 
Certified HTML5 Developer
Certified HTML5 DeveloperCertified HTML5 Developer
Certified HTML5 Developer
 
HTML5 developer Certification
HTML5 developer CertificationHTML5 developer Certification
HTML5 developer Certification
 
ppt of MANOJ KUMAR.pptx
ppt of MANOJ KUMAR.pptxppt of MANOJ KUMAR.pptx
ppt of MANOJ KUMAR.pptx
 
In Class Assignment 1 .docx
In Class Assignment 1                                        .docxIn Class Assignment 1                                        .docx
In Class Assignment 1 .docx
 
Developing Branding Solutions for 2013
Developing Branding Solutions for 2013Developing Branding Solutions for 2013
Developing Branding Solutions for 2013
 
Web design and Development
Web design and DevelopmentWeb design and Development
Web design and Development
 
HTML
HTMLHTML
HTML
 
Html xhtml tag-sheet
Html xhtml tag-sheetHtml xhtml tag-sheet
Html xhtml tag-sheet
 
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities:  Leveraging the Power of the Adobe Web Pub...Familiar Tools, New Possibilities:  Leveraging the Power of the Adobe Web Pub...
Familiar Tools, New Possibilities: Leveraging the Power of the Adobe Web Pub...
 
Html.ppt
Html.pptHtml.ppt
Html.ppt
 
Top 5 HTML 5 Tools For Web Development
Top 5 HTML 5 Tools For Web Development Top 5 HTML 5 Tools For Web Development
Top 5 HTML 5 Tools For Web Development
 
Successful Web Typography - The Developer's Ampersandwich
Successful Web Typography - The Developer's AmpersandwichSuccessful Web Typography - The Developer's Ampersandwich
Successful Web Typography - The Developer's Ampersandwich
 
Html5
Html5Html5
Html5
 
HTML5 introduction for beginners
HTML5 introduction for beginnersHTML5 introduction for beginners
HTML5 introduction for beginners
 

Mehr von Saif Ullah Dar (8)

Session no 1 html
Session no 1 htmlSession no 1 html
Session no 1 html
 
Session no 3 bzu
Session no 3 bzuSession no 3 bzu
Session no 3 bzu
 
Session no 2 For BZU
Session no 2 For BZUSession no 2 For BZU
Session no 2 For BZU
 
Java script session 4
Java script session 4Java script session 4
Java script session 4
 
Java script session 3
Java script session 3Java script session 3
Java script session 3
 
Xml Session No 1
Xml Session No 1Xml Session No 1
Xml Session No 1
 
Java script Session No 1
Java script Session No 1Java script Session No 1
Java script Session No 1
 
Session No1
Session No1 Session No1
Session No1
 

Kürzlich hochgeladen

Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
KarakKing
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
heathfieldcps1
 

Kürzlich hochgeladen (20)

Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.This PowerPoint helps students to consider the concept of infinity.
This PowerPoint helps students to consider the concept of infinity.
 
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptxExploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
Exploring_the_Narrative_Style_of_Amitav_Ghoshs_Gun_Island.pptx
 
Food safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdfFood safety_Challenges food safety laboratories_.pdf
Food safety_Challenges food safety laboratories_.pdf
 
Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)Accessible Digital Futures project (20/03/2024)
Accessible Digital Futures project (20/03/2024)
 
ICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptxICT Role in 21st Century Education & its Challenges.pptx
ICT Role in 21st Century Education & its Challenges.pptx
 
How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17How to Add New Custom Addons Path in Odoo 17
How to Add New Custom Addons Path in Odoo 17
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
Key note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdfKey note speaker Neum_Admir Softic_ENG.pdf
Key note speaker Neum_Admir Softic_ENG.pdf
 
Plant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptxPlant propagation: Sexual and Asexual propapagation.pptx
Plant propagation: Sexual and Asexual propapagation.pptx
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
How to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptxHow to setup Pycharm environment for Odoo 17.pptx
How to setup Pycharm environment for Odoo 17.pptx
 
Wellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptxWellbeing inclusion and digital dystopias.pptx
Wellbeing inclusion and digital dystopias.pptx
 
Micro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdfMicro-Scholarship, What it is, How can it help me.pdf
Micro-Scholarship, What it is, How can it help me.pdf
 
Single or Multiple melodic lines structure
Single or Multiple melodic lines structureSingle or Multiple melodic lines structure
Single or Multiple melodic lines structure
 
Interdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptxInterdisciplinary_Insights_Data_Collection_Methods.pptx
Interdisciplinary_Insights_Data_Collection_Methods.pptx
 
The basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptxThe basics of sentences session 3pptx.pptx
The basics of sentences session 3pptx.pptx
 

Session no 3