Scribd
Upload
5 views

HTML Tags Vs Elements Vs Attributes

HTML Tags vs Elements vs Attributes

Uploaded by

Mohammed Abdi
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
5 views

HTML Tags Vs Elements Vs Attributes

HTML Tags vs Elements vs Attributes

Uploaded by

Mohammed Abdi
Copyright
© © All Rights Reserved
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

HTML Tags vs Elements vs Attributes: What’s the

Difference?
So, you’re thinking about learning the Hyper Text Markup Language (HTML) that’s used
to create webpages? Whether you’re looking to embark on a career in web
design/development, or if you are just doing it as a hobby, HTML will open up a whole
new world of opportunities. Using this knowledge, you can navigate through the
otherwise complex mechanics that power webpages, email, and even some
applications.

HTML Tags

Tags are used to define the beginning and end of an HTML element. They consist of an
opening bracket ( < ), followed by the name of the element and then a closing bracket
( > ). If an attribute is being used in the tag, it will be included after the element.

Here’s an example of the HTML title tag:

1 <title> <title>

HTML Elements

The element consists of both the opening and closing tags as well as
what’s inside those tags. It normally consists of some structure that’s used to define the
respective tags.

Here’s an example of the HTML title element:

1 <title>My Webpage</title>

In this example, the HTML element is a title of “My Webpage,” complete with the
opening and closing title tags.

HTML Attributes

Last but not least, attributes are used to define a property for one or more HTML
elements. They are found within the element’s opening tag, often containing spaces that
are separated by value pairs.

Here’s an example of the HTML alt text attribute:

1 <img src="dogs-playing.gif" alt="dogs playing outside">


In this example, the HTML attribute is an alt text of “dogs playing outside” for the image
“dogs-playing.gif.” While images will typically render and display regardless of whether
or not they contain alt text, adding this attribute is beneficial for several different
reasons. For starters, alt text assists visitors with visual disabilities in identifying images
and their content. Text-to-speech software will translate the alt text into actual speech,
allowing the user to understand the image. Furthermore, search engines pay close
attention to the alt text attribute of images, using this information to determine their
meaning.

To Recap…

In HTML, tags are used at the beginning and end of an element. The element itself
consists of the tags as well as the structure inside. And attributes are given to elements
for the purpose of defining their property. Hopefully, this will give you a better
understanding of tags, elements and attributes.

Thanks for reading, follow your passion by finding the perfect course, just for you over
on

HTML Elements Types


Elements can be placed in two distinct groups: block level and inline
level elements. The former make up the document's structure, while the latter
dress up the contents of a block.

Also, a block element occupies 100% of the available width and it is rendered
with a line break before and after. Whereas, an inline element will take up only as
much space as it needs.

The most commonly used block-level elements


are <div>, <p>, <h1> through <h6>, <form>, <ol>, <ul>, <li>, and so on. Whereas,
the commonly used inline-level elements
are <img>, <a>, <span>, <strong>, <b>, <em>, <i>, <code>, <input>, <button>, etc

Q,2 How do you create a link that will connect to another web page when clicked

HTML <a> tag provides you option to specify an email address


to send an email. While using <a> tag as an email tag, you will
use mailto: email address along with href attribute. Following
is the syntax of using mailto instead of using http
How do you create text on a webpage that will allow you to
send an email when clicked?
Answer:
To change text into a clickable link to send email, use the mailto command within
the href tag. The format is as follows:

<a href=”mailto:youremailaddress”>text to be clicked</a>

Q3. How are active links different from normal links?

The default color for normal and active links is blue. Some browsers recognize an
active link when the mouse cursor is placed over that link, others recognize active
links when the link has the focus. Those that don’t have a mouse cursor over that
link is considered a normal link.
Here is the piece of code :-
<html>
<head>
<style>
/* unvisited link */
a:link {
color: red;
}

/* visited link */
a:visited {
color: green;
}

/* mouse over link */


a:hover {
color: hotpink;
}

/* selected link */
a:active {
color: blue;
}
</style>
</head>
<body>

<p><b><a href="any_page_name.html" target="_blank">This is a


link</a></b></p>
<p><b>Note:</b> a:hover MUST come after a:link and a:visited in the
CSS definition in order to be effective.</p>
<p><b>Note:</b> a:active MUST come after a:hover in the CSS definition
in order to be effective.</p>

</body>
</html>

3,B What happens if you open the external CSS file in a browser?

If you try to open the external CSS file in a browser, the


browser cannot open the file, because the file has a different
extension.
The only way to use an external CSS file is to reference it
using <link/> tag within another html document.
<html>

<head>

<bodycolor ="green"><fontsize="4"color="deeppink"><u><b>

<marquee>HELLO CURIOUS I HOPE THIS ANSWER WILL HELP YOU</marquee></u></b></font>

</head>

</body>

</html>

You might also like