Basic HTML Tutorial: Introduction to Elements, Tags, and Attributes

Basic-HTML-Tutorial-Introduction-to-Elements-Tags-and-Attributes

This tutorial is a continuation of the previous basic HTML tutorial, for those of you who have not had time to read them can access them here. Now we will get acquainted with the Elements, Tags, and Attributes which is the basic structure of writing HTML code. A structure of the HTML code must consist of three components, so I hope you can understand it clearly because as a basis for making a website look.

HTML Element

Element is a one-piece consisting of tags, attributes and all of the text that is in between the opening and closing tags. You do not have to worry about what is meant by tags and attributes, because I will also be discussing the two components of the HTML. As for the writing element format is:

<tagname>content</tagname>
<p>This is my First HTML</p>

Posts between tag <p> through </ p> That is an element in HTML. Understanding this element often interchangeable with the tag, there is a call tag as an element example is when you open the site W3Schools, then there is a special explanation of the tag does not exist, because it has become one with the elements.

HTML Tag

Surely you already know the structure of writing HTML code which usually has a basic structure like <html>, <head>, <head>, <body>, </ body>, </ html>. If you look at the structure of the HTML code then it is called with a tag on the HTML markup language. Tags in HTML has a function to tell the web browser what and how a text should be displayed. As we have learned HTML file is simply a plain text file, web browser which will process the file and display it. Most HTML tags written in pairs, which consists of an opening tag and a closing tag. The opening tag is written using square brackets like <h1>, while the closing tag is written by adding a slash or slash like </ h1>. Typically a tag has attributes, namely the additional information to be displayed on the browser, suppose I want to create text with the title Learning HTML that has a red background and the text is in the middle, then writing the code html are as follows:

<h1 style="background-color: red" align="center">Belajar HTML</h1>

If you notice the above HTML code, then the <h1> and </ h1> tags in HTML called. There are many other HTML tags such as <body> tag which serves to hold the entire text or information that will be displayed in a web browser. <Body> tag has a partner in the form of a closing tag is </ body>, so it could be said that this is paired tag. No HTML tags in an empty term, ie tags that do not have the text (content) like most tags are used to move to a new line or the next. The most tags have no content and no pairing alias does not have a closing tag. Writing tag in HTML is not case sensitive, meaning there is no influence when you write a tag in lowercase or uppercase, <h1> is the same meaning with the <H1>

HTML Attributes

A tag in HTML usually have an attribute or multiple attributes depending on the need for the desired display of the tag itself. As I mentioned above, that the attributes of the HTML used to provide additional information that is written in the opening tag. This function varies depending on the tag value and where it is placed. Some attributes are common and can be used in all known global tag attributes, but usually only serves to tag itself.

attribute consists of the attribute names and attribute values, for example if you look at the HTML code above, the attributes of the <h1> is background-color and align. Where background-color attribute has the value red, and align attribute has the value center. In fact, later on we will be more set the display of HTML tags via CSS. Some examples of HTML attributes are as follows:

Attribute Lang
Lang attributes used to describe to the search engines what language is used by a website, usually writing lang attribute is located in the opening tag <html>. An example is the <html lang = "en-US"> which means that the website is using the American English language.

Attribute Title
To create paragraphs in HTML is defined using the <p> tag, where the tag <p> This has a title attribute that title, for example, is as follows:
<p title = "About Paragraph"> This is an HTML student for beginners </ p>

Attribute href 
If you want to make a link in HTML is defined using the tag <a>, while for the address of the link itself is defined using the href attribute, so between <a> tag with the href attribute is usually always side by side, as interrelated. Examples of its use are as follows:

<a href="http://aplikasivfp.blogspot.com"> Learning HTML </a>

Attributes Size
When you want to include or exclude the images into a website, the tag used is <img> which is usually the images that we insert has a size such as height and width. So the size attribute consisting of width and height is usually used for the image. Examples of writing code is as follows:

<img src="aplikasivfp.blogspot.com" width=500" height="300">

Attributes Alt
This attribute is used as an alternative when the image does not appear on the computer screen in the form of writing. Before the image is displayed in full usually writing about the first image appears. To bring the writing then we define this by using the alt attribute. This attribute is strongly recommended when your input images into the website, because it influences the search engine such as Google that effect to increase our ranking in Google's eyes. Writing sample code is as follows:

<Img src = "aplikasivfp.blogspot.com" alt = "aplikasivfp.blogspot.com picture" width = 500 "height =" 300 ">

That is a brief explanation about the introduction of elements, tags and attributes in HTML, as the cover so that you more clearly, I will give full html code consisting of three components. The next article I will discuss about HTML Headings, element heading and heading styles.

<html lang="en-US">
<head>
 <title>Learning HTML Beginner</title>
</head>
<body>
 <h1 style="background-color: Red" align="center">learning HTML</h1>
 <h2 style="background-color: green" align="left">learning HTML</h2>
 <h3 style="background-color: blue" align="right">learning HTML</h3>
 <p title="About Paragrap"> It is learned HTML for beginners</p>
 <a href="http://aplikasivfp.blogspot.com">Belajar HTML</a>
 <img src="aplikasivfp.blogspot.com" alt="aplikasivfp.blogspot.com picture" width=500" height="300"> 
</body>
</html>

0 Response to "Basic HTML Tutorial: Introduction to Elements, Tags, and Attributes"

Post a Comment