WT PPT U1

Department of Computer Engineering
Web Technology
Unit –I Web Essentials and Mark-up language- HTML
MET Bhujbal Knowledge City

Introduction to Web technology
► Web technology is a method by which computers communicate with
each other with the help of markup languages and multimedia
packages.
► Web Technology refers to the various tools and techniques that are utilized in
the process of communication between different types of devices over the
Internet.
► Further Web technology involves developing a website for the Internet (World
Wide Web) or an intranet (a private network).
► In the same way, it can range from developing the simplest static single page
of plain text to the most complex web-based internet applications.

► Web Technology can be classified into the following sections:
► World Wide Web (WWW): WWW can be defined as the collection of different
websites around the world, containing different information shared via local servers(or
computers).
► The World Wide Web is based on several different technologies: Web browsers,
Hypertext Markup Language (HTML), and Hypertext Transfer Protocol (HTTP).

► Web Browser: The web browser is an application software to explore www (World
Wide Web). It provides an interface between the server and the client and requests to
the server for web documents and services.
► Whenever we search for anything on the internet, the browser loads a web page written
in HTML, including text, links, images, and other items such as style sheets and
JavaScript functions.
► Google Chrome, Microsoft Edge, Mozilla Firefox, and Safari are examples of web
browsers.

How does a Web Browser Work?
► A web browser helps us find information anywhere on the internet.

► It is installed on the client’s computer and requests information from the web server
such a type of working model is called a client-server model.

► The browser receives information through HTTP protocol.
► In which transmission of data is defined. When the browser received data from the
server, it is rendered in HTML to user-readable form, and, information is displayed on
the device screen.
► HTTP Request
► HTTP Requests are messages which are sent by the client or user to initiate an action on
the server.
► The first line of the message includes the request message from the client to the server,
the method which is applied to the resource, the identifier of the resource, and the
protocol version.

► HTTP Response
► HTTP Response sent by a server to the client.
► The response is used to provide the client with the resource it requested.
► It is also used to inform the client that the action requested has been carried out.
► It can also inform the client that an error occurred in processing its request. (If
requested URL not found).

► Web Server: A web server is a program that processes the network requests of the
users and serves them with files that create web pages.
► This exchange takes place using Hypertext Transfer Protocol (HTTP).
► web servers are computers used to store HTTP files which makes a website and when a
client requests a certain website, it delivers the requested website to the client.
► For example, you want to open Facebook on your laptop and enter the URL in the
search bar of Google. Now, the laptop will send an HTTP request to view the Facebook
webpage to another computer known as the webserver.

► This computer (webserver) contains all the files (usually in HTTP format) which make
up the website like text, images, gif files, etc.
► After processing the request, the web server will send the requested website-related files
to your computer and then you can reach the website.
► One web server can handle multiple users at any given time which is a necessity
otherwise there had to be a web server for each user and considering the current world
population, is nearly close to impossible.
► A web server is never disconnected from the internet because if it was, then it won’t be
able to receive any requests, and therefore cannot process them.

Example

► Web Pages: A webpage is a digital document that is linked to the World Wide
Web and viewable by anyone connected to the internet who has a web
browser.
► It can contain any type of information, such as text, color, graphics, animations, videos,
sounds, etc.
► A webpage is a document that is written in HTML, it can be viewed from the Internet.
It can be accessed by entering the URL on the address bar of the web browser.

► Web Development: Web development refers to the building, creating, and
maintaining of websites.
► It includes aspects such as web design, web publishing, web programming, and
database management.
► It is the creation of an application that works over the internet i.e. websites.
► Web Development can be classified into two ways:
► Frontend
► Backend

► Frontend Development: The part of a website that the user interacts directly is termed
as front end. It is also referred to as the ‘client side’ of the application.
► HTML, CSS, JavaScript, etc.
► Backend Development: Backend is the server side of a website.

► It is the part of the website that users cannot see and interact.
► It is the portion of software that does not come in direct contact with the users. It is used
to store and arrange data.
► Node js, Python, DBMS, PHP, etc.

HTML
► HTML stands for Hypertext Markup Language.

► It is used to design web pages. With the help of HTML, you can create a complete
website structure.
► HTML is a combination of Hypertext and Markup language.
► Hypertext defines the link between the web pages and markup language defines the text
document within the tag that define the structure of web pages.
► HTML basically contains Tags and Attributes that are used to design the web pages.
Also, we can link multiple pages using Hyperlinks.

► HTML is used to create web pages and web applications.
► We can create a static website by HTML only.
► By using HTML with CSS and JavaScript we will be able to create interactive and
dynamic websites.
► It is platform-independent because it can be displayed on any platform like Windows,
Linux, Macintosh, etc.
► It facilitates the programmer to add Graphics, Videos, and Sound to the web pages
which makes it more attractive and interactive.
► HTML is a case-insensitive language, which means we can use tags either in lower-case
or upper-case.

HTML History
► HTML was created by Tim Berners-Lee in 1991. The first-ever version of HTML was
HTML 1.0, but the first standard version was HTML 2.0, published in 1995.

Simple Example of HTML (Eg 1)
<!DOCTYPE>
<html>
<head>
<title>MET Bhujbal Knowledge City</title>
</head>
<body>
<h1>AIDS Dept</h1>
<p>There are 60 students in TE AIDS</p>
</body>
</html>

Description of HTML Example
► <!DOCTYPE>: It defines the document type or it instruct the browser about the
version of HTML.
► <html > :This tag informs the browser that it is an HTML document. Text between
html tag describes the web document. It is a container for all other elements of HTML
except <!DOCTYPE>
► <head>: It should be the first element inside the <html> element, which contains the
metadata(information about the document). It must be closed before the body tag opens.
► <title>: As its name suggested, it is used to add the title of that HTML page which
appears at the top of the browser window. It must be placed inside the head tag and
should close immediately. (Optional)

► <body> : Text between body tag describes the body content of the page that is visible to
the end user. This tag contains the main content of the HTML document.
► <h1> : Text between <h1> tag describes the first level heading of the webpage.
► <p> : Text between <p> tag describes the paragraph of the webpage.

HTML text Editors
• An HTML file is a text file, so to create an HTML file we can use any text editors.
• Text editors are the programs which allow editing in a written text, hence to create a
web page we need to write our code in some text editor.
• There are various types of text editors available which you can directly download, but
for a beginner, the best text editor is Notepad (Windows) or TextEdit (Mac).
• After learning the basics, you can easily use other professional text editors which
are, Notepad++, Sublime Text, Vim, etc.

Building blocks of HTML
► An HTML document consists of its basic building blocks which are:

• Tags: An HTML tag surrounds the content and applies meaning to it. It is written
between < and > brackets.
• Attribute: An attribute in HTML provides extra information about the element, and it
is applied within the start tag. An HTML attribute contains two fields: name & value.
► <tag name attribute_name= " attr_value"> content </ tag name>
► Elements: An HTML element is an individual component of an HTML file. In an
HTML file, everything written within tags is termed as HTML element.

HTML Tag Examples (Eg 2)
► <p style = "Color:blue">There are 60 students in TE AIDS</p>

HTML Comments
► The comment tag is used to insert comments in the HTML code.

► It is a good practice of coding so that the coder and the reader can get help
to understand the code.
► It is useful to understand the steps of the complex code.
► The comment tag is helpful while debugging codes.

► Types of HTML Comments: There are three types of comments in HTML which are:
• Single-line comment
• Multi-lines comment
• Using <comment> tag

► Single-line comment: Single-line comment is given inside the ( <!– comment –> )
tag.
► Multi-line comment: Multiple lines can be given by the same syntax (<!– –>),
Basically it’s the same as we used in single line comment, the difference is half part of
the comment (” –> “), which is appended where the intended comment line ends.


► Comment tag: There used to be an HTML <comment> tag, but currently it is not
supported by any modern browser.
► <comment>This is a comment </comment>

HTML Elements
► An HTML element is a collection of start and end tags with the content inserted in
between them.
► Syntax:
► <tagname > Contents... </tagname>
► HTML Element: The HTML element consists of 3 parts.

• Opening tag: It is used to tell the browser where the content material starts.
• Closing tag: It is used to tell the browser where the content material ends.
• Content: It is the actual content material inside the opening and closing tag.

Empty HTML Elements
► HTML Elements without any content i.e., that do not print anything are called Empty
elements.
► Empty HTML elements do not have an ending tag.
► For instance. <br>, <hr>, etc are HTML empty elements.

HTML Heading
► HTML heading tag is used to define the headings of a page.

► There are six levels of headings defined by HTML.
► These 6 heading elements are h1, h2, h3, h4, h5, and h6; with h1 being the highest level
and h6 being the least.
► Changing the size of HTML Headings:
► <h1 style="font-size: 50px">H1 with new size.</h1>

► Horizontal rule: The <hr> tag which stands for the horizontal rule is used to define a
thematic break in an HTML page.
► The <hr> tag is an empty tag, and it does not require any end tag. It is basically used to
separate content.
► Dl tag
► The <dl> tag in HTML is used to represent the description list. This tag is used
with <dt> and <dd> tag.
<dl>
<dt> Web Technology</dt>
<dd> it is a collection of tools </dd>
</dl>

Details tag
► The <details> tag is used for the content/information which is initially hidden but could be
displayed if the user wishes to see it.
► The summary tag is used with the details tag for specifying visible heading.
<details>
<summary>HTML</summary>
<p>It is used to create static website</p>


</details>

tags
► Dialog tag : <dialog open>Hello</dialog>

► Center tag : <center> Welcome all </center>
► B tag (bold text): <b> It is a WT class </b>
► I tag (italic text) : <i> It is a WT class </i>
► Mark tag (highlight): <mark> It is a WT class </mark>
► Header tag (html 5): <header> content </header>
► Footer tag (html 5):<footer> content </footer>
► Sub tag (subscript text): <p> x <sub>3</sub> </p>
► Sup tag (superscript text): <p> x <sup>3</sup> </p>
► Ins tag (underline text) : <ins> content</ins>

► Q tag (quoted text): <q> hello </q>
► Abbr tag (Abbreviation text): The <abbr> element is used to define a text as an
acronym or abbreviation.
► <p><abbr title="MET Bhujbal Knowledge City">MET BKC</abbr></p>

Div Tag
► The div tag is known as Division tag. The div tag is used in HTML to make divisions of
content in the web page like (text, images, header, footer, navigation bar, etc).
► Div tag has both open (<div>) and closing (</div>) tag and it is mandatory to close the
tag.
► The Div is the most usable tag in web development because it helps us to separate out
data in the web page and we can create a particular section for particular data or
function in the web pages.

P tag
► <p> content <p>

► p tag automatically adds space before and after any paragraph, which is basically
margins added by the browser.
► If a user adds multiple spaces, the browser reduces them to a single space.
► If a user adds multiple lines, the browser reduces them to a single line.
► By default, the display of the Paragraph element is set to “block” which you can change
using CSS.
► This means that if you add another paragraph to the webpage the next paragraph will be
inserted in the next line on the webpage.

► Align attribute: The <p> tag specifically supports the alignment attribute and allows us
to align our paragraphs in left, right, or center alignment.
► <p align="value">
► Value= center, left and right

► <pre> tag: Paragraph tag ignores all the changes of lines and extra spaces within a
paragraph, but there is a way to preserve this by the use of the <pre> tag.
► <pre> Content </pre>

HTML Links
► It is a connection from one web resource to another.

► A link has two ends, An anchor and a direction.
► The link starts at the “source” anchor and points to the “destination” anchor, which may
be any Web resource such as an image, a video clip, a sound bite, a program, an HTML
document, or an element within an HTML document.
► Links are specified in HTML using the “a” tag.
► <a href = “url”>text </a>

► href : The href attribute is used to specify the destination address of the link
used. "href" stands for Hypertext reference.
► Text link : The text link is the visible part of the link. It is what the viewer
clicks on.
► Target Attribute in Links
► The target attribute is used to specify the location where the linked document is
opened.
► If you set the target attribute to "_self", the link will open in the same
window or tab.
► If you set the target attribute to "_blank", the link will open in a new browser
window or tab.

Image in HTML
► <img> tag is used to add or embed the images to a webpage/website.

► The “img” tag is an empty tag, which means it can contain only a list of attributes and it
has no closing tag.
► <img src="url" alt="some_text" width=“” height=“”>
► Image as a reference:
► <a href =“url” > <img src = “url”> </a>
► We can add GIF in the same way as we add image in the html.

HTML Tables
► Table is an arrangement of data in rows and columns.

► Table tag is used to add a table in HTML.
► tr tag is used to define table row.
► th tag is used to define the table header.
► By default, table headings are bold and centered.
► A table data/cell is defined with the “td” tag.

Example
<table>
<tr>
<th>Name </th>
<th>Surname</th>
<th>Contact no </th>
</tr>
<tr>
<td> Sam </td>
<td> Singh </td>
<td> 1233445 </td>
</tr>
</table>
HTML Lists
► A list is a record of short pieces of related information or used to display the data or any
information on web pages in the ordered or unordered form.
► li tag is used to add list in html.
► ul : unordered list
► ol : ordered list

Example
<h3>Subjects</h3>
<ol>
<li>WT</li>
<li>DBMS</li>
<li>CN</li>
<li>AI</li>
</ol>

► In the unordered list we can also change the shape of marker.
► <ul style="list-style-type: circle">
► <ul style="list-style-type: square">
► <ul style="list-style-type: disc"> by default
► <ul style="list-style-type: none"> no marker
► We can also make nested lists in HTML. (list inside another list)

► In an ordered list, items are marked with numbers by default.
► We can also change the marker in an ordered list.
• reversed: It defines that the order will be descending.
• start: It defines from which number or alphabet the order will start.
• type: It defines which type(1, A, a, I, and i) of the order you want in your list of
numeric, alphabetic, or Roman numbers.

► <ol reversed>
<li>HTML</li>
</ol>
► <ol start="5">
► <ol type="i">

HTML Description List
► A description list contains the description of each term.

► The <dl> tag is used to define the description list.
► The <dt> tag defines the term name.
► The <dd> tag describes each term.
► <dl>
<dt>Sugar</dt>
<dd>* 500 gms</dd>
<dt>Milk</dt>
<dd>* 1 ltr </dd>
</dl>

HTML Block and Inline Elements
► Block Level Elements: A block-level element always starts on a new line and stretches
out to the left and right as far as it can i.e, it occupies the whole horizontal space of its
parent element & the height is equal to the content’s height.
► Inline Elements: An inline element is the opposite of the block-level element. It does
not start on a new line and takes up only the necessary width ie., it only occupies the
space bounded by the tags defining the HTML element, instead of breaking the flow of
the content.

Example
► <p style = "border: 2px solid red;">There are 60 students in TE AIDS</p>

(block element)
► <span style ="border: 2px solid blue;">There are 60 students in TE A </span>
(inline element)
► Block Level Elements supported tags are: p,dl,dd,dt,div,hr,ol,ul,li,table, etc.
► Inline Level Elements supported tags are: span, img,a,sub,sup,I,b,,etc.

HTML frame tag (not supported in HTML
5)
► HTML <frame> tag defines the area within an HTML file where another HTML web
page can be displayed.
► A <frame> tag is used with <frameset>, and it divides a webpage into multiple sections
or frames, and each frame can contain different web pages.
► Note: Do not use HTML <frame> tag as it is not supported in HTML5,

instead we can use <iframe> or <div>

HTML iframe tag
► The iframe in HTML stands for Inline Frame. The ” iframe ” tag defines a rectangular
region within the document in which the browser can display a separate document,
including scrollbars and borders.
► <iframe src="URL" title="description“ height =“200” width =“200”></iframe>

HTML Form
► An HTML form is a section of a document that contains controls such as text fields,
password fields, checkboxes, radio buttons, submit button, menus, etc.
<form> content </form>
► Input element: It is used to create form fields, and to take input from the user.
<form>
Enter your name <br>
<input type="text" name="username">
</form>
► If you will omit the 'name' attribute then the text filed input will not be
submitted to the server.

► Textarea tag: The <textarea> tag in HTML is used to insert multiple-line text in a
form. The size of <textarea> can be specified either using "rows" or "cols" attributes or
by CSS.
► <textarea rows ="3" cols ="30"> </textarea>
► Label Tag: It is considered better to have a label in form. As it makes the code
parser/browser/user-friendly.
► If you click on the label tag, it will focus on the text control.
► To do so, you need to have for attribute in label tag that must be same as id attribute of
input tag.

<form>
<label for="firstname">First Name: </label> <br/>
<input type="text" id="firstname" name="firstname"/>
<label for="password">Password: </label>
<input type="password" id="password" name="password"/> <br/>
</form>

HTML 5 Email Field Control
► The email field is new in HTML 5. It validates the text for the correct email address.
You must use @ and . in this field.
► <label for ="email"> email Id </label>
<input type ="email" id ="email" name ="email">
► Radio Button Control: The radio button is used to select one option from multiple
options.
► <label for ="gender"> Gender: </label>
<input type ="radio" id ="gender" name= "gender" value ="female" /> female
<input type ="radio" id ="gender" name="gender" value="male"/>male

► Checkbox Control: The checkbox control is used to check multiple options from
given checkboxes.
Hobby <br><br>
<input type ="checkbox" id ="cricket" name="cricket" value ="cricket"/> Cricket
<br>
<input type ="checkbox" id ="Football" name="Football" value ="Football"/>
Football <br>
<input type ="checkbox" id ="Dance" name="Dance" value ="Dance"/> Dance <br>
► Submit button control: It is used to add a submit button on the web page. When a
user clicks on submit button, then form gets submitted to the server.
► <input type="submit" value="submit">
Fieldset Element
► HTML < fieldset > element:

► The <fieldset> element in HTML is used to group the related information of a form.
This element is used with <legend> element which provides a caption for the grouped
elements.
<form>
<fieldset>
<legend> User Information </legend>
Content------
</fieldset>
</form>

Difference between HTML and HTML5
• HTML5 supports both audio and video while none of them were part of.
• HTML cannot allow JavaScript to run within the web browser, while HTML5 provides
full support for running JavaScript.
• In HTML5, inline mathML and SVG can be used in a text, while in HTML it is not
possible.
• HTML5 supports new types of form controls, such as date and time, email, number,
category, title, Url, search, etc.
• Many elements have been introduced in HTML5. Some of the most important are time,
audio, description, embed, fig, shape, footer, article, canvas, navy, output, section,
source, track, video, etc.

CSS (Cascading Style Sheets)
► CSS is used to enhance the visual presentation of web pages.
► Without the use of CSS, a web page will appear visually unappealing.
► Basic structure of CSS:
<style>body {
background-color: lightgray;
}
h1 {
color: green;
text-align: center;
}
p{
font-family: sans-serif;
font-size: 16px;
} </style>
Types of CSS
► There are three types of CSS :
► Inline CSS
► Internal or Embedded CSS
► External CSS
► Inline CSS: Inline CSS contains the CSS property in the body section attached to the
element is known as inline CSS. This kind of style is specified within an HTML tag
using the style attribute.
<body>
<p style="color:red; font-size:50px;
font-style:italic; text-align:center;">
Welcome to all
</p> </body>

► Internal or Embedded CSS: This can be used when a single HTML document must be
styled uniquely.
► The CSS rule set should be within the HTML file in the head section i.e. the CSS is
embedded within the <style> tag inside the head section of the HTML file.

► External CSS:
► External CSS contains separate CSS files that contain only style properties with the help
of tag attributes (For example class, id, heading, … etc).
► CSS property is written in a separate file with a .css extension and should be linked to
the HTML document using a link tag.
► It means that, for each element, style can be set only once and will be applied across
web pages.

Example CSS file
body {
background-color:powderblue;
}
.main {
text-align:center;
}
.GFG {
color:#009900;
font-size:50px;
font-weight:bold;
}
.png {
font-style:bold;
font-size:20px;
}MET Bhujbal Knowledge City
Example (HTML file link to the CSS file)
<!DOCTYPE>
<html>
<head>
<Title>External CSS </Title>
<link rel="stylesheet" href="css_sheet.css">
</head>
<body>
<div class="GFG"> Welcome to Web Tech Lecture </div>
<div class="Main"> Today we will read CSS </div>
<div class ="png"> CSS is used to provide style to the website</div>
</body>
</html>
► Priorities of CSS: Inline CSS has the highest priority, then comes Internal/Embedded
followed by External CSS which has the least priority. Multiple style sheets can be
defined on one page.

CSS Borders
► CSS border properties allow us to set the style, color, and width of the border.
► Different properties can be set for all the different borders i.e. Top border, right border, bottom
border, and left border.
► Following are the types of borders:
• dotted
• dashed
• solid
• double
• groove
• ridge
• inset
• outset
• none
• hidden
► There are different ways by which we can define borders in HTML.
► <p style =“border-style: solid” >content </p>
► <p style =“border-style: dashed”> content </p>
OR
<style>
P{
border-style:solid;
border-width:10px;
}
</style>

Another way
<style>
p.dotted {
border-style: dotted;
}
p.dashed {
border-style: dashed;
}
p.solid {
border-style: solid;
}
p.double {
border-style: double;
}
</style>
<body>
<p class="dotted">A dotted border.</p>
<p class="dashed">A dashed border.</p>
<p class="solid">A solid border.</p>
<p class="double">A double border.</p>
</body>

Example
<style>
.style{
height: 50px;
width: 100px;
border-style:solid;
border-width:5px;
color: green;
background-color: lightgray;
padding-left: 20px;
padding-top: 20px;
font-style: italic;
}
► Image with CSS:
► <img class="GFG" src=“url">

Icon in CSS
<head>
<title>CSS Icon</title>
<link rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awe
some.min.css">
</head
Add this link in head section

<body>
<h1>welcome to all</h1>
<i class="fa fa-cloud"
style="font-size:52px;” </i>
<i class="fa fa-heart"
style="font-size:32px;"></i>
<i class="fa fa-file"
<i class="fa fa-car"
<i class="fa fa-bars"
style="font-size:32px;">
</i></body>
CSS Links
► CSS property can be used to style the links in various different ways.
► States of Link:
► There are four states of links given below:
• a:link => This is a normal, unvisited link.
• a:visited => This is a link visited by user at least once
• a:hover => This is a link when mouse hovers over it
• a:active => This is a link that is just clicked.

► The default value of links:
• By default the links created are underlined.
• When the mouse is hovered above a link, it changes to a hand icon.
• Normal/unvisited links are blue.
• Visited links a colored purple.
• Active links are colored red.

How to use link in css
<!DOCTYPE html>
<html>
<head>
<title>CSS links</title>
<style>
p{
font-size: 25px;
text-align: center; }
</style> </head>
<body>
<p> <a href="https://metbkcengg.ac.in/"> MET BKC</a> </p>
</body>
</html>
► CSS Properties of Links: Some basic CSS properties of links are given below:
• color
• font-family
• text-decoration (to add or remove underline): text-decoration: none (remove underline)
• background-color
• Syntax:
a:link {
color:red;
}

► a:visited
{
font-family: arial;
}

Cascade, specificity, and inheritance
► It controls how CSS is applied to HTML and how conflicts between style declarations
are resolved.
► For example, at some point, you will be working on a project and you will find that the
CSS you thought should be applied to an element is not working.
► Often, the problem is that you create two rules that apply different values of the same
property to the same element.
► Cascade and specificity are mechanisms that control which rule applies when there is
such a conflict.

► Cascade : When two rules from the same cascade layer apply and both
have equal specificity, the one that is defined last in the stylesheet is the one
that will be used.
h1 {
color: red;
}
h1 {
color: blue;
}

► Specificity: It is the algorithm that the browser uses to decide which property value is
applied to an element.
► If multiple style blocks have different selectors that configure the same property with
different values and target the same element, specificity decides the property value that
gets applied to the element.
► An element selector is less specific.
► A class selector is more specific.

Example
.main-heading {
color: red;
}
h1 {
color: blue;
}
<h1 class="main-heading">This is my heading.</h1>
(main heading is applied)

Inheritance
► Some CSS property values set on parent elements are inherited by their child
elements, and some aren’t.
► For example, if you set a color and font-family on an element, every element
inside it will also be styled with that color and font, unless you've directly
applied different color and font values to them.

WT PPT U1

Uploaded by

Document Information

Original Description:

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

WT PPT U1

Uploaded by

Copyright:

Available Formats

Department of Computer Engineering

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► A web browser helps us find information anywhere on the internet.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► Backend Development: Backend is the server side of a website.

MET Bhujbal Knowledge City

► HTML stands for Hypertext Markup Language.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► An HTML document consists of its basic building blocks which are:

MET Bhujbal Knowledge City

► <p style = "Color:blue">There are 60 students in TE AIDS</p>

MET Bhujbal Knowledge City

► The comment tag is used to insert comments in the HTML code.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► HTML Element: The HTML element consists of 3 parts.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► HTML heading tag is used to define the headings of a page.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► Dialog tag : <dialog open>Hello</dialog>

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► <p> content <p>

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► It is a connection from one web resource to another.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► <img> tag is used to add or embed the images to a webpage/website.

MET Bhujbal Knowledge City

► Table is an arrangement of data in rows and columns.

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

MET Bhujbal Knowledge City

► A description list contains the description of each term.