HTML ATTRIBUTES | Readstall

HTML ATTRIBUTES

13-12-18 Gudditi Naganjaneyulu 0 comment

HTML  ATTRIBUTES:

We have familiar with HTML Tags  like heading and paragraph  and other tags .We used those tags for simplest  form  but most of HTML Tag contains having attributes .Which extra bits contains bits of information.

ATTRIBUTE:  An used to define the characteristics of an HTML element and is placed inside the element’s opening tag. All attributes are made up of two parts:  of name  &  value.

Name: The property you want to set. For example, the paragraph <p>element in the example carries an attribute whose name align,which you can use to indicate the alignment of paragraph on page

The value is what you want the value of the property to be set and always put within quotations. The below example shows three possible values of align attribute: left, center and right.

Attribute names and attribute values are case-insensitive. However, the World Wide Web Consortium (W3C) recommends lowercase attributes/attribute values in their HTML 4 recommendation.

Example

<!DOCTYPE html>

<html>

<head>

<title>Align Attribute Example</title>

</head>

<body>

<p align=”left”>This is left aligned</p>

<p align=”center”>This is center aligned</p>

<p align=”right”>This is right aligned</p>

</body>

</html>

This will display the following result:

This is left aligned

This is center aligned

Html core attributes :

The four core attributes that can be used on the majority of HTML elements (although not all)

are:

  • Id
  • Title
  • Class
  • Style

The Id Attribute

The id attribute of an HTML tag can be used to uniquely identify any element within an HTML page. There are two primary reasons that you might want to use an id attribute on an element:

If an element carries an id attribute as a unique identifier, it is possible to identify just that element and its content.

If you have two elements of the same name within a Web page (or style sheet), you can use the id attribute to distinguish between elements that have the same name.

Example

<p id=”html”>This para explains what is HTML</p>

<p id=”css”>This para explains what is Cascading Style Sheet</p>

The title Attribute

The title attribute gives a suggested title for the element. They syntax for the title attribute is similar as explained for id attribute:

The behavior of this attribute will depend upon the element that carries it, although it is often displayed as a tooltip when cursor comes over the element or while the element is loading.

<title>The title Attribute Example</title>

</head>

<body>

<h3 title=”Hello HTML!”>Titled Heading Tag Example</h3>

</body>

</html>

Result :

Titled Heading Tag Example

The class Attribute

The class attribute issued to associate an element with a style sheet, and specifies the class of element. You will learn more about the use of the class attribute when you will learn Cascading Style Sheet (CSS). So for now you can avoid it.

The style Attribute

The style attribute allows you to specify Cascading Style Sheet (CSS) rules within the element.

<!DOCTYPE html>

<html>

<head>

<title>The Style Attribute</title>

</head>

<body>

<p style=”font-family:arial; color:#FF0000;”>Some text…</p>

</body>

</html>

This produces result

Some text…



Leave a reply