Incoming and Outgoing Shipments in 3 STEPS Using Odoo 17
HTML Introduction
1. Based on w3 schools
HTML, DHTML
UNIT II
INT355 – Internet and Web Technology
2. HTML
HTML – Hyper Text Markup Language
A markup language is a modern system for
annotating a document in a way that is
syntactically distinguishable from the text.
Markup languages For the processing, definition
and presentation of text.
Specifies code for formatting, both the layout and
style
3. HTML
Code used to specify format are called tags.
Tags – describe content
HTML document contains – tags and plain text
HTML documents – Web pages
5. HTML Example
The Doctype defines the ‘doctype’
Webpage defined between <html></html>
Visible content between <body></body>
HTML tags normally come pairs: start tag, end
tag
<tagname> content </tagname>
Content with tagname – HTML Element
7. <DOCTYPE>
A normal doctype consists of the following parts,
in exactly the following order:
Any case-insensitive match for the string
"<!DOCTYPE"
One or more space characters
Any case-insensitive match for the string "HTML"
Optionally, one or more space characters
A ">" character
Example: <!DOCTYPE html>
8. <DOCTYPE>
A deprecated doctype consists of the following parts, in exactly the following order:
Any case-insensitive match for the string "<!DOCTYPE"
One or more space characters
Any case-insensitive match for the string "HTML"
One or more space characters
Any case-insensitive match for the string "PUBLIC"
One or more space characters
A quote mark (public ID), consisting of either a """ character or a "'" character
A permitted public ID
A matching quote mark (public ID), identical to the quote mark (public ID) used earlier (either a """ character or a "'" character)
Conditionally, depending on whether it is part of a permitted-public-ID-system-ID-combination, the following parts, in exactly the following order:
One or more space characters.
A quote mark (system ID), consisting of either a """ character or a "'" character
A permitted system ID
A matching quote mark (system ID), identical to the quote mark (system ID) used earlier (either a """ character or a "'" character)
Optionally, one or more space characters.
A ">" character
Example: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
12. Empty HTML Elements
HTML elements with no content are called
empty elements.
Tip: In XHTML, all elements must be closed.
Adding a slash inside the start tag, like <br />,
is the proper way of closing empty elements in
XHTML (and XML).
13. HTML Attributes
HTML elements can have attributes
Attributes provide additional information
about an element
Attributes are always specified in the start tag
Attributes come in name/value pairs like:
name="value"
14. Attributes example
<a href="http://www.w3schools.com">This is a
link</a>
Attribute values should always be enclosed in
quotes.
Double style quotes are the most common, but
single style quotes are also allowed.
In some rare situations, when the attribute value
itself contains quotes, it is necessary to use single
quotes: name='John "ShotGun" Nelson'
15. HEAD Element
The <head> element is a container for all the
head elements. Elements inside <head> can
include scripts, instruct the browser where to
find style sheets, provide meta information,
and more.
The following tags can be added to the head
section: <title>, <style>, <meta>, <link>,
<script>, <noscript>, and <base>.
16. Title Element
The <title> tag defines the title of the document.
The <title> element is required in all
HTML/XHTML documents.
The <title> element:
defines a title in the browser toolbar
provides a title for the page when it is added to
favorites
displays a title for the page in search-engine results
18. Base Element
The <base> tag specifies the base URL/target
for all relative URLs in a page:
Example
<head>
<base
href="http://www.w3schools.com/images/"
target="_blank">
</head>
19. Meta Element
Metadata is data (information) about data.
The <meta> tag provides metadata about the HTML document.
Metadata will not be displayed on the page, but will be machine
parsable.
Meta elements are typically used to specify page description,
keywords, author of the document, last modified, and other
metadata.
The metadata can be used by browsers (how to display content or
reload page), search engines (keywords), or other web services.
<meta> tags always go inside the <head> element.
20. Example
Define keywords for search engines:
Define a description of your web page:
<meta name="description" content="Free Web tutorials on HTML
and CSS">
Define the author of a page:
<meta name="keywords" content="HTML, CSS, XML, XHTML,
JavaScript">
<meta name="author" content="Hege Refsnes">
Refresh document every 30 seconds:
<meta http-equiv="refresh" content="30">
22. HTML Entities
Some characters are reserved in HTML.
It is not possible to use the less than (<) or greater
than (>) signs in your text, because the browser will
mix them with tags.
To actually display reserved characters, we must use
character entities in the HTML source code.
A character entity looks like this:
&entity_name; OR
&#entity_number;
An annotation is metadata (e.g. a comment, explanation, presentational markup) attached to text, image, or other data.Metadata is "data about data".