20-CSS-Intoduction-types - Id and Class Selectors - Backgournd Properties-22-01-2024

<html>
<head>
<style type="text/css">
body
{ background-color:#0000FF; }
h1
{ color:white;
text-align:right;
background-color:yellow;}
p
{ font-family:"Times New Roman";
font-size:50px;
color:red;
text-align:left;}
</style>
<link rel="stylesheet" type="text/css" href="mystyle.css"/>
</head><body>
<h1>CSS example!</h1>
<p>This is a paragraph.</p>
<p style="color:white;background-color:aqua;">This is a second paragraph</p>
</body>
</html>
/*mystyle.css*/
body
{ background-color:#000000; }
h1
{ color:blue;
text-align:left;
background-color:aqua;
font-family:Arial;
}
p
{ font-family:Arial;
font-size:50px;
color:#00A178;
background-color:yellow;}
<html>
<head>
p#para1
{ text-align:center;
color:red; }
p#para3
{
color:black;
text-align:right;
}
#para4{
background-color:aqua;
}
p{color:green;background-color:lightblue;}
</style> </head>
<body>
<p id="para1">Hello World!</p>
<p> The id selector uses the id attribute of the HTML element, and is defined with a "#".The
style rule below will be applied to the element with id="para2" </p>
<p id="para3">This paragraph is not affected by the style.</p>
<p id="para4"> asdflkasdfsad adlfkjasd ladfjlajdsf</p>
</body>
</html>
<html>
<head>
.redcenter
{ text-align:center;
color:green;
font-family:Times New Roman;}
</style></head>
<body>
<h1 class="redcenter">Center-aligned heading</h1>
<p class="redcenter">Center-aligned paragraph.</p>
<p class="redcenter">right-aligned paragragh</p>
<h2 class="redcenter">h2 text</h2>
</body></html>
<html>
<head>
body{
background-color:yellow;
background-image:url(myimage.jpg);
background-repeat:repeat-y;
background-attachment:scroll;
background-position:top center;
/*background-size:cover;*/
}
/*
body{
background:aqua url(myimage.jpg) no-repeat bottom right;
background: url(myimage.jpg) center center/300px 100px no-repeat scroll #ccc;
}*/
</style>
</head>
<body>
<h4>Heading 4</h4>
<p>bbbvcbbcdfjbdfbgjdfhgjfhgjdhfgk
fgkldfhghdfkhkghdfkh
fghdfkhkldfhlmv,xcglrgjepr;sdmv;s[f[pwoewflsd;mklwejf
gerogoerog</p>
<ol>
<li>one</li>
<li>two</li>
<li>one</li>
<li>two</li>
</ol>
<ul>
<li>aaaaaaaaaaa</li>
<li>bbbbbbbbbbbbb</li>
<li>ccccccccccccccc</li>
<li>ddddddddddddddddd</li>
</ul>
<p>fkjasdlfkjalsdkfjllkjlaskdjflaksjdflkjasdlfkjalskdfj<br>
asdasdlfkjalsdkfjlaksdjflkasjdflkjasdlfkjasldkfj<br>
askdkfjasldkfjalskdfjalskdfjlaskdfj<br>
asdfjasdlfkjasldfkjasdfasdflkjasdlfkkj
asdfjasdlfkjasldfkjasdfasdflkjasdlfkkjasdf
asdfjasdlfkjasldfkjasdfasdflkjasdlfkkjasdfasdf
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
asdasdlfkjalsdkfjlaksdjflkasjdflkjasdlfkjasldkfjfa
sdf
asdffasdfasdff<br>
asdkfhasldkfalsdkfjlaksdjf
</p>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p><p>fkjasdlfkjalsdkfjllkjlaskdjflaksjdflkjasdlfkjalskdfj<br>
asdff
asfd
asdffasdf
asdffasdfdf
asdffasdfasdf
sdf
asdffasdfasdff<br>
</p>
</body>
</html>

20-CSS-Intoduction-types - Id and Class Selectors - Backgournd Properties-22-01-2024

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

20-CSS-Intoduction-types - Id and Class Selectors - Backgournd Properties-22-01-2024

Uploaded by

Copyright:

Available Formats

<html>

You might also like