Inline Styles are created within the HTML code of the web page, that is why these are called inline styles.
In Inline styles, declaration are enclosed in double quotes. Also in inline style, the declarations are specified as value of style attribute as per following syntax:
Syntax:
<Element/tagname style="declaration attributes">
For example:
we define the following statement like this for <p> Element:
Here <p> is the paragraph Element/tag
<p style="font-family:Arial;color:red">
In the example:
p is the paragraph tag
style is the style attributes
and "font-family:Arial;color:red" is the declarations attributes
NOTE: When inline styles are added to a element/tag, they occur only for the individual elements where they are specified and not for all similar tags on the page.
The Following HTML code that defines an inline style for <table> element which is applied on to the table and its children elements.
<html>
<head>
<title>
Inline Style sheet for Table element
</title>
<body style="background-color:sky light;">
<table style="font-size:small;font-family:Arial;background-color:yellow;">
<caption> Inline style for Table</caption>
<tr>
<th style="color:blue;">
S. No.</th>
<th style="color:green;">
Emp-Name</th>
<th style="color:red;">
Emp-designation </th>
</tr>
<tr><td>1.</td><td>Jon Genre</td><td>M.D.</td></tr>
<tr><td>2.</td><td>roke Genre</td><td>vice M.D.</td></tr>
<tr><td>3.</td><td>posto marker</td><td>civil department </td></tr>
</table>
</body>
</html>
Browser View of following web page:
In Inline styles, declaration are enclosed in double quotes. Also in inline style, the declarations are specified as value of style attribute as per following syntax:
Syntax:
<Element/tagname style="declaration attributes">
For example:
we define the following statement like this for <p> Element:
Here <p> is the paragraph Element/tag
<p style="font-family:Arial;color:red">
In the example:
p is the paragraph tag
style is the style attributes
and "font-family:Arial;color:red" is the declarations attributes
NOTE: When inline styles are added to a element/tag, they occur only for the individual elements where they are specified and not for all similar tags on the page.
The Following HTML code that defines an inline style for <table> element which is applied on to the table and its children elements.
<html>
<head>
<title>
Inline Style sheet for Table element
</title>
<body style="background-color:sky light;">
<table style="font-size:small;font-family:Arial;background-color:yellow;">
<caption> Inline style for Table</caption>
<tr>
<th style="color:blue;">
S. No.</th>
<th style="color:green;">
Emp-Name</th>
<th style="color:red;">
Emp-designation </th>
</tr>
<tr><td>1.</td><td>Jon Genre</td><td>M.D.</td></tr>
<tr><td>2.</td><td>roke Genre</td><td>vice M.D.</td></tr>
<tr><td>3.</td><td>posto marker</td><td>civil department </td></tr>
</table>
</body>
</html>
Browser View of following web page:
No comments:
Post a Comment