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

HTML Winword

Uploaded by

rohitsingh958817
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)
34 views

HTML Winword

Uploaded by

rohitsingh958817
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/ 15

HTML

Hyper Text Markup Language


Hyper Text: - HTML (Hyper Text Markup Language) is the most basic building
block of the Web. It defines the meaning and structure of web content. Other
technologies besides HTML are generally used to describe a web page's
appearance/presentation (CSS) or functionality/behavior (JavaScript).

"Hypertext" refers to links that connect web pages to one another, either within
a single website or between websites. Links are a fundamental aspect of the
Web. By uploading content to the Internet and linking it to pages created by
other people, you become an active participant in the World Wide Web.

Markup: - HTML uses "markup" to annotate text, images, and other content for
display in a Web browser. HTML markup includes special "elements" such
as <head>, <title>, <body>, <header>, <footer>, <article>, <section>, <p>, <div>,
<span>, <img>, <aside>, <audio>, <canvas>, <datalist>, <details>, <embed>, <na
v>, <search>, <output>, <progress>, <video>, <ul>, <ol>, <li> and many others.

An HTML element is set off from other text in a document by "tags", which
consist of the element name surrounded by "<" and ">". The name of an
element inside a tag is case-insensitive. That is, it can be written in uppercase,
lowercase, or a mixture. For example, the <title> tag can be written
as <Title>, <TITLE>, or in any other way. However, the convention and
recommended practice is to write tags in lowercase.

The articles below can help you learn more about HTML.

Key Resource
HTML Introduction: - If you're new to web development, be sure to read
our HTML Basic article to learn what HTML is and how to use it.

HTML Tutorials: - For articles about how to use HTML, as well as tutorials and
complete examples, check out our HTML learning area.
HTML Reference: - In our extensive HTML Reference section, you'll find the
details about every element and attribute in HTML.

Beginner’s Tutorials: - Our HTML Learning Area features multiple modules that
teach HTML from the ground up — no previous knowledge required.

Introduction to HTML: - This module sets the stage, getting you used to
important concepts and syntax such as looking at applying HTML to text, how to
create hyperlinks, and how to use HTML to structure a web page.

Multimedia and embedding: - This module explores how to use HTML to


include multimedia in your web pages, including the different ways that images
can be included, and how to embed video, audio, and even entire other web
pages.

HTML Table: - Representing tabular data on a webpage in an understandable,


accessible way can be a challenge. This module covers basic table markup, along
with more complex features such as implementing captions and summaries.

HTML Forms: - Forms are a very important part of the Web — these provide
much of the functionality you need for interacting with websites, e.g. registering
and logging in, sending feedback, buying products, and more. This module gets
you started with creating the client-side/front-end parts of forms.

Use HTML to solve common problem: - Provides links to sections of content


explaining how to use HTML to solve very common problems when creating a
web page: dealing with titles, adding images or videos, emphasizing content,
creating a basic form, etc.

Advanced Topics
CORS enabled image: - The cross origin attribute, in combination with an
appropriate CORS header, allows images defined by the <img> element to be
loaded from foreign origins and used in a <canvas> element as if they were
being loaded from the current origin.
CORS Settings attributer: - Some HTML elements that provide support for CORS,
such as <img> or <video>, have a cross origin attribute (cross origin property),
which lets you configure the CORS requests for the element's fetched data.

Preloading content with rel=“preload”: - The preload value of


the <link> element's rel attribute allows you to write declarative fetch requests
in your HTML <head>, specifying resources that your pages will need very soon
after loading, which you therefore want to start preloading early in the lifecycle
of a page load, before the browser's main rendering machinery kicks in. This
ensures that they are made available earlier and are less likely to block the
page's first render, leading to performance improvements. This article provides
a basic guide to how preload works.

REFERENCE
HTML Reference: - HTML consists of elements, each of which may be modified
by some number of attributes. HTML documents are connected to each other
with links.

HTML elements Reference: - Browse a list of all HTML elements.

HTML attributes Reference: - Elements in HTML have attributes. These are


additional values that configure the elements or adjust their behavior in various
ways.

Global attribute: - Global attributes may be specified on all HTML


elements, even those not specified in the standard. This means that any non-
standard elements must still permit these attributes, even though those
elements make the document HTML5-noncompliant.

Inline-level element and block level element: - HTML elements are usually
"inline-level" or "block-level" elements. An inline-level element occupies only
the space bounded by the tags that define it. A block-level element occupies the
entire space of its parent element (container), thereby creating a "block box".

Guide to media type and format on the web: -


The <audio> and <video> elements allow you to play audio and video media
natively within your content without the need for external software support.
HTML content categories: - HTML is comprised of several kinds of content, each
of which is allowed to be used in certain contexts and is disallowed in others.
Similarly, each context has a set of other content categories it can contain and
elements that can or can't be used in them. This is a guide to these categories.

Quirks mode and standard mode: - Historical information on quirks mode and
standards mode.

Related topics
Apply color to HTML element using CSS: - This article covers most of the ways
you use CSS to add color to HTML content, listing what parts of HTML
documents can be colored and what CSS properties to use when doing so.

Use
1. The <head> tag in HTML serves as a container for metadata (data about
data) and is placed between the <html> tag and the <body> tag. It typically
contains information that is not displayed directly on the web page but is
essential for various purposes. Let’s explore some key elements that can go
inside the <head> section:
<!DOCTYPE html>
<html lang="en">
<head>
<title>My Awesome Website</title>
</head>
<body>
<!-- Content goes here -->
</body>
</html>

2. Certainly! Let’s explore how to use the <header> and <footer> tags in HTML
to define the header and footer sections of a web page:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>My Awesome Website</title>
</head>
<body>
<header>
<h1>Welcome to My Site</h1>
<nav>
<ul>
<li><a href="/">Home</a></li>
<li><a href="/about">About</a></li>
<!-- Other navigation links -->
</ul>
</nav>
</header>
<!-- Rest of your content -->
</body>
</html>

3. Certainly! Let’s explore how to use the <article> tag in HTML.


The <article> tag specifies independent, self-contained content. Here are some
key points about it:
<article>
<h2>Google Chrome</h2>
<p>Google Chrome is a web browser developed by Google, released in 2008.
Chrome is the world's most popular web browser today!</p>
</article>
4. Certainly! Let’s explore how to use the <section> tag in HTML.
The <section> tag defines a standalone section within a webpage, containing
logically connected content. Here are some key points about it:
<article>
<h2>Google Chrome</h2>
<p>Google Chrome is a web browser developed by Google, released in 2008.
Chrome is the world's most popular web browser today!</p>
</article>

5. The <p> tag in HTML is a block-level element used to define a paragraph of


text within a web page. Here’s how you can use it:
<p>This is a paragraph of text.</p>
6. Certainly! The <div> tag in HTML is a versatile element used to
define sections within a web page. Here’s how you can use it:
<div>
<h2>This is a heading in a div element</h2>
<p>This is some text in a div element.</p>
</div>
7. Certainly! The <img> tag in HTML is used to embed an image in a web page.
It creates a holding space for the referenced image. Here’s how you can use it:
<img src="pic_trulli.jpg" alt="Italian Trulli">
8. Certainly! Let’s explore how to use the <ul>, <ol>, and <li> tags in HTML to
create lists:
<ul>
<li>Coffee</li>
<li>Tea</li>
<li>Milk</li>
</ul>
How to use
<html>
<head>
<title>font tag</title>
</head>
<body>
<h1>change font using CSS</h1>
<h2>Aadil Badshah</h2>
<p>This is normal text without any font styling</p>
<p style="color:blue;">text with normal size and default face</p>
<p style="font-size:50px;color:red;">text with normal size and default face</p>
<p style="font-family:bell mt;color:purple;">text with changed face</p>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
</head>
<body>
<h1>Welcome Programmers</h1>

<p>This website is GeeksforGeeks.</p>

</body>
</html>
<html>
<head>
<title>Aadil Badshah</title>
<body background="C:\Users\asus\OneDrive\
Pictures\Saved Pictures\images.jpg">
</body>
</html>

<!DOCTYPE html>
<html>
<body>
<h2>password</h2>
<form action="/action_page.php">
<lable for="username">username:
</lable><br>
<input type="text"id="username"
name="username"<br><br>
<lable for="Password">Password:
</lable><br>
<input type="text"id="Password"
name="Password"<br><br>
<input type="submit"value="submit">
</form>
<p> the characters in a password field are masked (shown as asterisks or circlr).</p>
</body>
</html>
<h5>Digital Computer</h5>
<html>
</marquee>
<head>
</body>
<title>Heading tag</title>
</html>
</head>

<body>

<marquee

bgcolor="yellow"

direction="Right">

<h1>Digital Computer</h1>

</marquee>

<marquee

bgcolor="blue"

direction="left">

<h2>new computer</h2>

</marquee>

<marquee

bgcolor="purple"

direction="up">

<h3>Digital Computer</h3>

</marquee>

<marquee

bgcolor="green"

direction="down">

<h4>Digital Computer</h4>

</marquee>

<marquee

bgcolor="yellow"

direction="Right"

scrollamount="50">
<html>

<head>

<title>Cover page</title>

</head>

<body text=white bgcolor=black>

<p align=left><font style="-size:30">learn</font></p>

<center><div style="background"black;width:1000"><font-size:55">computer

basic</font></div></center>

<p align=center><img src="D:\badshah\


1644575496_yhg4tfelyi3vya8vqm89ch8u5cry_img6.jpg"width=1200

hight=300>

<p align=right><font-size:30">Gourav Agarwal</font></p>

Useful for

<ul>

<li>Govermet Exam</li>

<li>Self Study</li>

<li>Step by step theory with practice example</li>

</ul>

<center><div style="background:black;width:500"><table rules=all bordercolor=white><tr><th><h1>An


easyway to learn computer<br>Be smart & modern</tr></th> </h2>

<center><div style="background:black;width:500"></table>
<html>

<head>

<title>Aadil badshah</title>

</head>

<body text=white bgcolor=pink>

<a href="https://www.instagram.com/">Instragram</a>

<a href="https://www.facebook.com/">Facebook</a>

<a href="https://x.com/">twitter</a>

<a href="https://www.youtube.com/">YouTube</a>

<a href="https://www.flipkart.com/">Flipkart</a>

<ul>

<li>Govermet Exam</li>

<li>Self Study</li>

<li>Step by step theory with practice example</li>

</ul>

</body>

</html>

<html>

<head>

<title>Aadil badshah</title>

</head>

<body text=white bgcolor=Black>

<h1>Digital computer academy</h1>

<h2>HTML JAVA PYTHONS CSS</h2>

<h3>Basic knowledge </h3>

<h4>Title goes here</h4>

<h5>Content goes here</h5>

<h6>This is a paragraph</h6>

</body>
<html>

<head>

<title>Digital computer</title>

<ol>

<li>Feader Footer</li>

<li>copyright symbol</li>

<li>Non breaking space</li>

<li>Greater than symbol</li>

<li>Double quotation mark</li>

<li>Content goes here</li>

<li>Most important</li>

<li>least important</li>

<li>title goes here</li>

<li>this is a paragraph</li>

</ol>

<html>

<head>

<title>Digital computer</title>

</head>

<table>

<tr>

<th>Feader Footer</th>

<th>copyright symbol</th>

<th>Double quotation mark</th>

<th>Content goes here</th>

</tr>

<tr>

<td>Non breaking space</td>

<td>Greater than symbol</td>

<td>Most important</td>

<td>least important</td>
</tr>

</table>
<html>

<head>

<title>Digital computer</title>

</head>

<body>

<header>header</header>

<footer>footer</footer>

<nav>navigation</nav>

<section>section</section>

<article>article</article>

<aside>aside</aside>

</body>

</html>

<title>Computer</title> <input id="hen" name="color" type="radio">HEN🐔 <br>


<link rel="stylesheet" href="style.css"> <input id="duck" name="color" type="radio">Duck🦆 <br></input>
</head> <li>What is a national Animal?</li>
<body> <input id="bear" name="color" type="radio">Bear<br>
<div> <input id="lion" name="color" type="radio">Lion<br>
<ul> <input id="monkey" name="color" type="radio">Monkey<br>
<li>Garnal knowledge MCQs: -</li> <input id="tiger" name="color" type="radio">Tiger<br></input>
<ul> </div>
<ol> </body>
<li>What is a national color?</li>

<input id="red" name="color" type="radio">Red<br>

<input id="green" name="color" type="radio">Green<br>

<input id="blue" name="color" type="radio">Blue<br>

<input id="pink" name="color" type="radio">Pink<br></input>

<li>What is a national Bird?</li>

<input id="peacock" name="color" type="radio">Peacock<br>

<input id="pigeon" name="color" type="radio">Pigeon<br>


<html>

<head>

<title>Digital computer</title>

</head>

<body>

<a href="https://www.flipkart.com/">Flipkart</a>&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp

<button onclick="location.href='https://www.youtube.com/' ">Youtube</botton>

</body>

</html>

<html>

<head>

<title>Comment</title>

<body>

<p title="Digital Computer Academy">Which institute do you study</p>

<p title="Yes I have">do you study</p>

<p title="I am 12th">which class</p>

<p title="I am from Haryana">Where are you from</p>

<p title="ohh Good">I am from faridabad</p>

<p title="Yes">ok </p>

</body>

</html>
<html>

<head>

<title>Digital computer</title>

</head>

<marquee

direction="Right">

<p align=center><img src="D:\badshah\


1644575496_yhg4tfelyi3vya8vqm89ch8u5cry_img6.jpg"width=1200
hight=300>

</marquee>

</html>

You might also like