Wednesday, February 11, 2015

Elements & Attributes

Elements in html




There are three elements every html consists of:

  1. Opening tag
  2. Element
  3. Closing tag

Example:
<head>
<title>my page</title>
</head>
<body>
my text
</body>
</html>



It should look like this:

<b>
This text is bold
</b>

This text is bold

Elements

·         Html
·         Head
·         Title
·         Body

<Html>
With this element should start every web page

<Head>
This tag should take place inside the head tag
Browser don’t show the elements in this tag, but these elements are very important for browsers and search engines. Here will stand the title tag, description tag…

<Title>
This element consists of the title of your web page, and as stated before, is very important for the web browsers.
This element takes place inside of the head tag.

<Body>
Tis element consists of other elements which makes the page, so everything inside will be shown in the browsers.


<html>



Attributes 




Html attributes are used to set attributes for elements. There are several attributes, and some of them are:

·         Class or ID attribute
·         Name attribute
·         Title attribute
·         Align attribute
·         Valign attribute


Class or ID atribut



These attributes are here to set points that we will call later in CSS file, and set styling for each.
So if we have class attribute for post, we will set in CSS its background, font color, post title color and size, text size, image width… So in html we just set tag: <div class=”post”>, write text, set image, set title…

Name attribute
Name attributes are assigned to set name for something, for example for the text field:


Name: <input type="text" name="name">
Last name: <input type="text" name="last name">



Title attribute

This attribute gives the tittle of the segment you are writing:

<p title="Learning html">This is my text</p>

Now you have set tittle for the text “this is my text” which is visible. When you take your mouse pointer over this text, little pop up will show text “Learning html”.


Align attribute

Align attribute is used for setting text position, image position…


<p align="center">Text</p>
<p align="left"> Text </p>
<p align="right"> Text </p>

This way we pushed second line of text to the left, centered first line, and pushed third line to the right.



Valign attribute

This attribute is the same as the align attribute, but defines vertical allignement in tables.



<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="307" valign="bottom" bgcolor="#CCCCCC">text </td>
</tr>
</table>

1 comment: