To create an internal(embedded styles) style instead of adding the style attribute to a element you need to use the style element to contain all instructions for page. the style element must have type="text/css" as an attribute for the browser to read style rules property.
To embed a style sheet you can use the <style> tag only within the <head> element of a web page.
Syntax:
<head>
<style type="text/css">
p{font-family:verdana;color:green;}
</style>
</head>
Here:
</head>: head tag start here
<style type="text/css">:Style tag begins here
p{font-family:verdana;color:green;}: CSS rule defined for p tag and written inside {&}
</style>:Style tag ends here
</head>: head tag ends here
For example:That uses internal style sheet to format all the table identically in a web page.
<html>
<head>
<title>
internat Style sheet for Table element
</title>
<style type="text/css">
body{background-color:yellow;}
table{font-family:verdana;font-size:small;color:blue;}
caption{color:red;background-color:black;}
</style>
</head>
<body>
<table>
<caption>Internal style for Table</caption>
<tr>
<th>
S. No.</th>
<th>
Emp-Name</th>
<th>
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 Above Document:
To embed a style sheet you can use the <style> tag only within the <head> element of a web page.
Syntax:
<head>
<style type="text/css">
p{font-family:verdana;color:green;}
</style>
</head>
Here:
</head>: head tag start here
<style type="text/css">:Style tag begins here
p{font-family:verdana;color:green;}: CSS rule defined for p tag and written inside {&}
</style>:Style tag ends here
</head>: head tag ends here
For example:That uses internal style sheet to format all the table identically in a web page.
<html>
<head>
<title>
internat Style sheet for Table element
</title>
<style type="text/css">
body{background-color:yellow;}
table{font-family:verdana;font-size:small;color:blue;}
caption{color:red;background-color:black;}
</style>
</head>
<body>
<table>
<caption>Internal style for Table</caption>
<tr>
<th>
S. No.</th>
<th>
Emp-Name</th>
<th>
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 Above Document:
No comments:
Post a Comment