Scribd
Upload
5 views

Csswithhtml 5

Uploaded by

Anuj Maurya
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
5 views

Csswithhtml 5

Uploaded by

Anuj Maurya
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<!-- internal css -->
<style>
p{
color:white;
background-color: burlywood;
}
h1,h2,h3,h4,h5,h6{
color: green;
background-color: yellow;
}
</style>
</head>
<body style="background-color: rgb(18, 25, 25);">
<!--
html => hyper text markup langauge
tags=> h1,h2,p(paragraph),input(make a input box),table,ol,ul

<opening tags attribute(attribute name :attribute


value;)>data</closing tag>

-->
<!-- this is a heading tag
six types of heading tag
<h1>data<h1> to <h6>data</h6>
-->

<!-- css (cascading style sheet)


three type of css
1)inline css
in the body and inside tags (style=" : ;")
2)internal css
in the head section using style tag(<style> tag
selector{attribute name:attribute value;} </style>)
3)external css
six type of selectors
1)element selector(tag selector)
2)class selector
3)ID selector
4)psuedo selector
5)attribute selector
6)universal selector
7)Group selector
-->
<!-- inline css -->
<h1 style="color:green;background-color:yellow; font-family: Cambria,
Cochin, Georgia, Times, 'Times New Roman', serif;">heading one</h1>
<p style="color:white">Lorem ipsum dolor sit amet consectetur adipisicing
elit. Ipsum, id quaerat maiores perferendis omnis accusamus optio impedit sit
eveniet quas quos quia suscipit incidunt rerum totam nesciunt nam ipsa
hic.</p>
<!-- internal css -->
<h2>heading two</h2>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Nostrum
accusamus cum tenetur delectus consectetur distinctio recusandae in aliquam
eligendi dicta voluptate porro ea dolorem pariatur perspiciatis eos animi, nam
exercitationem.</p>
<h3>heading three</h3>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Atque vitae
officiis nobis dolor iusto corporis accusantium cumque inventore repellat
itaque incidunt eligendi, aliquid velit, ex voluptates laboriosam qui dolores
dolorum?</p>
<h4>heading four</h4>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Atque vitae
officiis nobis dolor iusto corporis accusantium cumque inventore repellat
itaque incidunt eligendi, aliquid velit, ex voluptates laboriosam qui dolores
dolorum?</p>
<h5>heading five</h5>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Atque vitae
officiis nobis dolor iusto corporis accusantium cumque inventore repellat
itaque incidunt eligendi, aliquid velit, ex voluptates laboriosam qui dolores
dolorum?</p>
<h6>heading six</h6>
<p>Lorem ipsum dolor sit, amet consectetur adipisicing elit. Atque vitae
officiis nobis dolor iusto corporis accusantium cumque inventore repellat
itaque incidunt eligendi, aliquid velit, ex voluptates laboriosam qui dolores
dolorum?</p>

</body>
</html>

You might also like