0% found this document useful (0 votes)
2 views

HTML notes

HTML, or Hypertext Markup Language, is used to create and link web pages, developed by Timothy Berners-Lee in the 1990s. Key elements of HTML include the HTML element, head element, and body element, each serving distinct purposes in web document structure. Various tags and attributes are utilized for formatting text, setting colors, and organizing content within web pages.

Uploaded by

jimerajoanna
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
2 views

HTML notes

HTML, or Hypertext Markup Language, is used to create and link web pages, developed by Timothy Berners-Lee in the 1990s. Key elements of HTML include the HTML element, head element, and body element, each serving distinct purposes in web document structure. Various tags and attributes are utilized for formatting text, setting colors, and organizing content within web pages.

Uploaded by

jimerajoanna
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 4

HTML

-stands for Hypertext Markup Language.


This is the language used to create and link Web Pages together.
Web Page
- the document on the web which includes text, graphics, sounds, and video.
Timothy Berners-Lee – developed HTML
• 1990’s – HTML blossomed with the explosive growth of the World Wide Web (WWW).
WWW – World Wide Web
-is a system of interlinked hypertext documents accessed via the Internet.
Internet
- "Information Superhighway," is a worldwide, publicly accessible series of interconnected
computer networks that transmit data by packet switching using the standard Internet
Protocol (IP).
Text Editors
-are needed to create HTML document.
-allow you to manipulate the HTML tags directly.
• WYSIWYG (What You See Is What You Get) editors are HTML editors that attempt to
display the Web page as it will show on the browser.
Notepad - a common text-only (also referred to as plain text) editor.
• Tag – a marker used to delimit the start and end of an XML or HTML element.
• XML – Extensible Markup Language
(XML) is a general-purpose markup language. It is classified as an extensible language
because it allows its users to define their own elements.
Basic HTML Syntax
<TAGNAME ATTRIBUTE=VALUE ATTRIBUTE=VALUE...>
Tagname
-the type of text being defined by the tag
Attributes
-Gives extra or added information on how the element should behave.
• Not all HTML TAGS have attributes.
2 Types of Elements of a Tag
1. Container Elements – these are tags that are paired and have their contents between the
opening tag and the ending tag.
-The ending tag is recognized by a forward slash (/) before the tagname and it does not have
attributes.

Nested Tags
<center>
<b> <i> text to be set bold, italicized,
and centered </i> </b>
</center>

2. Empty Elements – single tags that do not alter any text. What they do instead is
insert something into the document.

3 HTML ELEMENTS
1. HTML Element -This element contains the entire file.
Syntax:
<html> </html>
-----------------------------------------------------------
<html>
Your entire HTML Documents
</html>
2. Head Element – header and contains information about the document that is not part
of the text.
Syntax:
<head> </head>
-------------------------------------------------------------------
<html>
<head>
<title> The title of your web page </title>
</head>
</html>
Title Element – contains the title of your document or what your web page is all about. All
HTML documents must have a TITLE element in the head section.
Syntax:
<title> </title>
-----------------------------------------------------------
<html>
<head>
<title> My Favorite Pet </title>
</head>
<body>
The contents of your web page.
</body>
</html>
3. Body Element – contains all the contents of your web page including the formatting tags,
pictures and all the information you want to publish on the Internet.
Syntax:
<body attributes...> </body>
Body Attributes
1. Background = “URL” The value of this attribute is a URL that designates an image source.
2. Text = “color” Sets the foreground for the text.
3. Link = “color” Sets the color of the text marking unvisited hypertext links.
4. Vlink = “color” Sets the color of the text marking visited hypertext links.
5. Alink = “color” Sets the color of text marking hypertext links when selected by the user.
6. Bgcolor = “color” Sets the background color for the document body.
Changing the Background Color
• <body bgcolor=“#FFFFFF”>
• <body bgcolor=“#934CE8”>
• <body bgcolor=white>
Changing Text Colors
• Text – controls the color of all the page’s body that isn’t a link, including headings, body
text, text inside tables and so on.
• Link – controls the color of normal, unfollowed links on the page.
• Vlink – controls the color of visited link.
• Alink – controls the color of a link that has the mouse button pressed on it but not
released.
<body bgcolor=“#000000” text=“FFFFFF”
link=“#9805FF”>
<body bgcolor=“black” text=“white”
link=“purple”>
Other HTML Basic Tags
Headings -used to give emphasis to a topic’s title
Syntax:
<H#> </H#>
Headers:
<H1>, <H2>, <H3>, <H4>, <H5>, <H6>

Heading Attributes
align=left|right|center|justify
Paragraphs
• Authors usually separate their thoughts and arguments into sequences of paragraphs.
• This tag inserts a non-printable character called new line before displaying the text inside
the tag.
Syntax: <P> </P> end tag is optional
Attributes:
align=left|right|center|justify
Physical text formatting tags:
• BOLD <B> </B>
• ITALICS <I> </I>
• UNDERLINE <U> </U>
• BLINK <BLINK> </BLINK>
• STRIKETHROUGH <S> </S>
• SUBSCRIPT <SUB> </SUB>
• SUPERSCRIPT <SUP> </SUP>
• MARQUEE <MARQUEE></MARQUEE>
Line Break -forces the browser to have a single line break (like pressing ENTER)
Syntax:
<BR>
Attribute:
clear=all|left|right
Preformatted Text -This element allows the browser to display the text inside the tag exactly
the way you type it in your text editor.
Syntax:
<PRE> </PRE>
Comment -Helps recognize the codes when updating the webpage
Syntax:
<!--comments-->
Font
• A design for a set of characters.
• A font is the combination of typeface and other qualities, such as size, pitch, and spacing.
Syntax:
<FONT> </FONT>
Attributes:
Size – sets the size of the font from 1 – 7 as
possible integer value.
Color – sets the text color.
Face – sets the typestyle for text.
• Arial
• Arial Black
• Courier
• MS Serif
• Tahoma
• Times New Roman
• Verdana

You might also like