Scribd
Upload
10 views11 pages

Ict Main Notes

The document provides a comprehensive overview of HTML tags and their functions, including deprecated tags and their modern alternatives. It also introduces CSS, highlighting its role in separating content from design and its advantages such as improved load speed, consistent styling, and responsive design. Additionally, it emphasizes the importance of CSS in enhancing user experience and accessibility.

Uploaded by

Audumber Haldankar
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
10 views11 pages

Ict Main Notes

The document provides a comprehensive overview of HTML tags and their functions, including deprecated tags and their modern alternatives. It also introduces CSS, highlighting its role in separating content from design and its advantages such as improved load speed, consistent styling, and responsive design. Additionally, it emphasizes the importance of CSS in enhancing user experience and accessibility.

Uploaded by

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

s

^)
xu Sc- c_

Tag Description

Defines a comment

< IDOCTYPE> Defines the document type

<a> Defines a hyperlink

<abbr> Defines an abbreviation or an acronym

<acronvm> Not supported in HTM 15. Use <abbr> instead.


Defines an acronym

<add ress> Defines contact information for the author/owner of a document

<a pplet> Not supported in HTML5. Use <embed> or <obiect> instead.


Defines an embedded applet

<a rea > Defines an area inside an image map

<a rtic le> Defines an article

<aside> Defines content aside from the page content

<a ud io> Defines embedded sound content

<b> Defines bold text

< base> Specifies the base URL/target for all relative URLs in a document

< ba sefont> Not supported in HTML5. Use CSS instead.


Specifies a default color, size, and font for alltext in a document

<bdi> lsolates a part of text that might be formatted in a different direction from ot
outside it

<bdo> Overrides the current text direction

<biA> Not supported in HTML5. Use CSS instead.


Defines big text

<blockquote> Defines a section that is quoted from another source

<bodv> Defines the document's body

<br> Defines a single line break

<button> Defines a clickable button

<ca nvas> Used to draw graphics, on the fly, via scripting (usually JavaScript)

<ca tion> Defines a ta ble caption


Not supported in HTML5. Use CSS instead'
<center>
Defines centered text

<cite> Defines the title of a work

<code> Defines a Piece of comPuter code

within a <colgr:-:> : :-.:nt


<col> Specifies column properties for each column

in a table for forma:: -g


<col qr oup> Specifies a Sroup of one or more columns

given content
<data> Adds a machine-readable translation of a

controls
<datalist> Specifies a list of pre-deflned options for input

list
<d d> Defines a description/value of a term in a description

<d el> Defines text that has been deleted from a document

view or hide
<details> Defines additional details that the user can

Specifies a term that is going to be defined within the content


<dfn>

<dia loq> Defines a dialog box or window

<dir> Not supported in HTML5 Use Sg!: instead'


Defines a directorY list

<div> Defines a section in a document

<d l> Defines a descriPtion list

<dt> Defines a term/name in a descrlption list

<em> Defines em Phasized text

<embed> Defines a container for an external application

<fieldset> Groups related elements in a form

<figcap tion> Defines a caption for a <figure> element

<fiqure> Specifies self-contained content

<font> Not supported in HTML5. use CSS instead'


Defines font, colot and size for text

<footer> Defines a footer for a document or section

<form> Defines an HTML form for user input

<frame> Not supported in HTML5.


Deflnes a window (a frame) in a frameset

<frameset> Not supported in HTML5'


Defines a set of frames

<h1> to < h6> Defines HTML head ings

< hea d> Contains metadata/information for the document

<header> Defines a hdader for a document or section

<hgroup> Defines a header and related content

<hr> Defines a thematic change in the content

<html> Defines the root of an HTML document

<t> Defines a part of text in an alternate voice or mood

<iframe> Defines an inline frame

<tmq> Defines an image

<input> Defines an input control

<tns> Defines a text that has been inserted into a document

<kbd> Defines keyboard input

<label> Defines a label for an <input> element

<legend> Defines a caption for a <fieldset> element

< li> Defines a list item

< lir k> Defines the relationship between a document and an external resource (mos
link to style sheets)

<main> Specifies the main content of a document

<mao> Defines an image map

<ma rk> Defines ma rked/high lighted text

<menu> Defines an unordered list

<meta> Defines metadata about an HTML document

<meter> Defines a scalar measurement within a known range (a gauge)

<nav> Defines navigation links

<noframes> Not supported in HTML5.


Defines an alternate content for users that do not support frames

<noscript> Defines an alternate content for users that do not support cllent-side scripts

<ob:ect> Defines a container for an external application


t

<o l> Defines an ordered list

<optgroup> Defines a group of related options in a drop-down list

<o ptio n > Defines an option in a drop-down list

<o utp ut> Defines the result of a calculation

<0> Defines a paragra ph

<paTam> Defines a parameter for an object

<pictu re> Defines a container for multiple image resources

<ore > Defines preformatted text

<progress> Represents the progress of a task

<q> Defines a short quotation

<rp> Defines what to show in browsers that do not support ruby annotations

< rt> Defines an explanation/pronunciation of characters (for East Asian typograp

<ru bv> Defines a ruby annotation (for East Asian typoBraphy)

<s> Defines text that is no longer correct

<samp> Defines sample output from a computer program

<script> Defines a client-side script

<search> Defines a search section

<section> Defines a section in a document

<select> Defines a drop-down list

<small> Defines smaller text

<50urce> Defines multiple media resources for media elements (<video> and <audio>)

<span> Defines a section in a document

<strike> Not supported in HTML5. Use 5rlgE or::: instead.


Defines strikethrough text

<Strong> Defines im portant text

<style> Defines style information for a document

<sub> Defines subscripted text

<summarv> Defines a visible heading for a <details> element


<5Up> Defines superscripted text

<svR> Defines a container for SVG graphics

<ta ble> Defines a ta ble

<t bodv> Groups the body content in a table

<td> Defines a cell in a table

ltsul3ls: Defines a container for content that should be hidden when the page loads

<textarea> Defines a multiline input control (text area)

<t{oat> Groups the footer content in a table

<th> Defines a header cell in a table

<t head > Groups the header content in a table

<time> Defines a specific time (or datetime)

<title> Defines a title for the document

<tr> Defines a row in a table

<track> Defines text tracks for media elements (<video> and <audio>)

<tt> Not supported in HTML5. Use CSS instead.


Defines teletype text

<u> Defines some text that is unarticulated and styled differently from normalte;

<ul> Defines an unordered list

<var> Defines a varia ble

<video> Defines embedded video content

<wbr> Defines a possible line-brea k

1. <l--This is a comment. Comments are not displayed in the browser-->


<p>Th is is a paragraph.</p>
This is a paragraph.

2. < IDOCTYPE html>


<html>
<head>
<title>Title of the document</title> The content of the document.....
</head>
<body>
The content of the document
</body>
</html>

3. Create a link to W3Schools.com:


<a href=" https : //www. w3schools. com" >Visit W3schools. com ! < /a >

The a element

Visit W3Schools.com !

4. An abbreviation is marked up as follows:


The <abbp title="Wor1d Health Or.ganization">WHO</abbn> was founded in
'1,948 .

The abbr element


The WHO was founded in 1948.

Contact information for Example.com:


5 <addness>
Wnitten by <a hnef="mailto : webmasten@example. com" >xiisci</a >. <br>
Visit us at: <bn> Written by xiisci.
ExampIe. com< bn >
Visit us ot:
KHORLIM, IVIAPUSA GOA< bn >
INDIA Exomple.com
</addness> KHORLIM, MAPUSA GOA
INDIA

6. < !DOCTYPE html>


<html>
<body>
<h 1>The bdo element</h 1.>
<p>This paragraph will go left-to-right.</p> <p><bdo dir="rtl">This paragraph willgo right-
to-left.</bdo></p>
</body> This paragraph will go left-to-right bdo
</html> element

.tfel-ot-thgir og lliw hpargarap

7. A simple HTML document:


<htmI>
<head>
< t it 1e >Title of the document< I t

</head>
it ]e > This is a heading
< body >
This is a paragraph.
<h 1>This is a heading< / h 1>
<p >This is a paragraph.</p>
</body>
<lhtml>

8. <p>To force<br> line breaks<br> in a text,<br> use the br<br> element,</p>

The br element
To fo rce
line breaks
in a text,
use the br
element.

9, <!DOCWPE html>
<htm l>
< bo dy>
<h1>HTML5 Canvas</h 1>
<canvas id="myCanvas" width="300" height="150" style="border:1px solid grey"></canvas>
</body>
</html>

10. table with a caption: The caption


<table> element
< caption >iYonthly savings<,/caption >
<tr> Monthly savings
<t h >lvlont h< /t h>
<th >Sa vi ng s< /th > Month Savings
</tr^> <tr> anuarv $ 100

</tn>
< t d >J a n u a

<td>$1oo</td>
ry< / td >
@E il
</table>
11.
The cite element
< !DOCTYPE html>
<html>
<body>
<h1>The cite element</h L>
<img src=" img_the_screa m.jpB'r width="220"
height="277" a lt="The Scream">
<p><cite>The Screa m</cite>
by Edward Munch. painted in 1893.</p>
</body>
</html>
The Screom by Edward Munch
Painted in 1893.

12. < IDOCTYPE html>


<html>
<body>
<h1>The dl, dd, and dt elements</h1>
<p>These three elements are used to create a description list:</p>
<d l>
<dt>Coffee</dt>
<dd>Black hot
<dt>M ilk</dt>
d rjn k</dd>
The dl, dd, and dt
<dd>White cold d rin k</dd
<ldl>
>
elements
</body>
</html> These three elements are used to create a
description list:

Coffee
Black hot drink
Milk
White cold drink

1.< !DOCTYPE html>


<html ng="en">
<head>
la
This is a heading
<title>Title of the docu ment</title>
</head> This is a paragraph.
<body>

<h 1>This is a heading</h1">


<p>This is a paragraph.</p>
</body>
</html>

2. < IDOCTYPE html>


<html>
<body>
Heading I
<h 1>Head ing 1</h1> Heading 2
<h2>Heading 2</h2>
< h3>Head ing 3</h3> Heading 3
<h4>Head ing 4</h4>
<h5>Head ing 5</h5>
Heading 4
< h6>Heading 6</h6>
Heading 5
</body>
</html> lleading 6

3. < IDOCTYPE html>


<html>
This text is trold
<body>

<p><b>Th is text is bold</b></p>


This text is italic
<p><i>This text is italic</i></p>
superscripl
<p>This is<sub> subscript</sub> and <su p>su pe rscript</su p></p> This is.r6,".;p1 and

</body>
</html>

HTML Formatting Elements


Formatting elements were designed to display specialtypes oftext:
o <[> ' Bold text
. <strong> - lmportant text
. <i> - ltalic text
. <em> - Emphasized text
. <mark> - Marked text
. <small> - Smaller text
. <del> - Deleted text
. <ins> - lnserted text
. <sub> - Subscript text
. <sup> - superscript text
CSS, or Cascading Style Sheets, is a stylesheet language used to describe
the presentation of a document written in HTML or XML. lt controls the
layout, colors, fonts, and overall visual appearance of web pages. CSS
enables developers to separate content from design, making it easier to
maintain and update websites. Cascading Style Sheets (CSS): CSS is
defined as a method sheet language that provides web designers control over
how an internet site communicates with web browsers including the formatting
and display of their HTML documents.
CSS or cascading sheet may be a text-based coding language that specifies the
website formats and the way a site communicates with web browsers. The
language allows web developers to regulate various styie elements and
functionalities, like layout, color, fonts,, and therefore the formatting and
display of HTML documents.

Advantages of CSS:

1. Separation of Content and Presentation:


- cSS allows developers to separate the structure of a web page (HTN4L) from its design
(CSS). This makes it easier to manage and update styles without altering the HTML
content.
2. lmproved Page Load Speed:
- By using external csS files, browsers can cache these files, reducing page load times for
returning visitors.
3. Consistent Styling:
- cSS enables the application of consistent styles across multiple pages. By linking the
same CSS file, changes made in one location automatically reflect across the entire site.
4. Responsive Design:
- CSS supports media queries, allowing developers to create responsive designs that
adapt to different screen sizes and devices.
5. Flexibility and Control:
- CSS provides extensive control over layout and design, including positioning,
animations, and transitions, which enhances user experience.
5. Accessibility:
- Proper use of cSS can improve accessibility for users with disabilities by allowing for
better control over how content is displayed.
7. Reduced Code Redundancy:
- With CSS, you can apply styles to multiple elements without repeating code, leading to
cleaner and more maintainable codebases.
8. Easy Maintenance:
- Changes to design elements can be made in one central location (the CSS file),
slmplifying maintenance and updates.
Advantages:

structure of a website and is a widety


: iilYkl1tjil".y,. used Markup language.

.' I::tf bror'rser supports HTML Language.


FITML is light weighted and fast to ioacl
. Storage of big files are allowed because
of the application cache feature.
. Do not get to purchase any extra software
b""urr. it,, by default r1r
. (atrhoush, being too fl""ibl" ;;;i;ri,
in vvlrr
every window.
w,,uu
. l::r-"-'lntax .6;il;j.
. ITML is simple to edit as beLg a plain texr.
. ]l1,-"-gl"tes easily with other,laiguug., ,r"t, as JavaScript, CSS etc.
HTML is that it is easy to code ev-enio. noui."
p-gru.*".r.
' also allows the utilization ;i ;;1;;r:ffch
makes designing a webpage
. "urfT"
It is fast to download as the text is compressible.
.
. I:y-y."ful_for beginners in rhe web a..lg"irg n"f A.
can be supponed to each und .u.;;.;;r;
0."#;X: if not supported ro al the
. HTML is built on almost every website, if
. is increasingty used foi a","
Iily!
not all websites.
,, iite xML syntax.
. "".a.
HTML has manv tas and attribute, ,hi.h-;;.;;;
Disadvantages: your line of code.

. It camot produce dynamic output alone,


. since it,s a static language.
Making the structure of HTMi d""r_;;;;;;;es
. Errors can be costly.
rough to understand.

' It is the time consuming as the time it


consume to maintain on the color
page and to make lists, tables and scheme of a
forms.
. We need to write a lot.of code for just
creating a simple webpage.
. w. har c ro check up rhe deprecated ,.g, ;; :;i;;,
.
,beeause anorher language rhar works uith"lttr.lL
nor ro use them ro appear
lru.'r.ptu..o ,rr" n^, *"rr, Iiir,'","g.
andhence the opposite language needs
to U" *a".riooA
. Security features offered by UTMI_ '"" and learned.
. are limi-tJ.
If we need to write down long code for
a webpage then it produces some
complexity. "*rG
. only static and plain pases so if we,d
,rffYl,;il.T?" like dynamic pages then
. Editing ofweb page need to be done
separately , they are not centralized_

You might also like