Scribd
Upload
24 views

html5 Tags2

The document contains code examples demonstrating the use of area, map, article, time, address and aside tags in HTML. It includes an image mapped with clickable areas, an article with an image, heading, paragraph, time and address tags, and an aside element with heading and paragraph.

Uploaded by

venusd95
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
24 views

html5 Tags2

The document contains code examples demonstrating the use of area, map, article, time, address and aside tags in HTML. It includes an image mapped with clickable areas, an article with an image, heading, paragraph, time and address tags, and an aside element with heading and paragraph.

Uploaded by

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

area and map tags:

<body>
<img src="kushal.jpg" usemap="#myphoto">
<map name="myphoto">
<area shape="rect" coords="126,219,237,314" href="home.html" alt="rectangle">
<area shape="circle" coords="202,233,250" href="Aboutus.html" alt="circle">
<area shape="poly" coords="210,135,155,324,283" href="js13.html" alt="triangle">
</map>
</body>

article tag:time and address tag

2)
<style>
img{
height: 300px;
width:300px;
}
</style>
</head>
<body>
<article style="width:500px;border:2px solid
green;padding:10px;margin:20px;border-radius:10px;">
<img src="https://cdn.britannica.com/77/170477-050-1C747EE3/Laptop-computer.jpg"
alt="computer">
<h1>Laptop Companies</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente saepe, ex
soluta dolore
mollitia dignissimos. Doloremque aspernatur voluptate, aliquam corrupti ipsam
repudiandae
accusamus dolorem in earum! Esse obcaecati, ut in enim, eaque saepe incidunt
maiores,
eum quisquam perspiciatis consequatur quasi sequi praesentium dignissimos
explicabo unde?
Vitae quod ea accusantium provident fuga c
onsectetur sequi? Iure labore inventore dolores veniam? Dolorem, dolore?</p>
<time>23/12/2020 12:50pm</time>
<address> by venu dasari</address>
</article>
</body>

3)

<aside style="width:25%;float:left;border:2px solid


red;margin:20px;height:500px;padding: 10px;">
<h1>computer</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam labore
quidem a quo? Eius, qui asperiores?
Suscipit eligendi harum adipisci itaque et fugit aliquam? Itaque.</p>
</aside>

total code:

<style>
img{
height: 300px;
width:300px;
}
</style>
</head>
<body>
<article style="width:65%;border:2px solid
green;padding:10px;margin:20px;border-radius:10px;float: left;">
<img src="https://cdn.britannica.com/77/170477-050-1C747EE3/Laptop-computer.jpg"
alt="computer">
<h1>Laptop Companies</h1>
<p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Sapiente saepe, ex
soluta dolore
mollitia dignissimos. Doloremque aspernatur voluptate, aliquam corrupti ipsam
repudiandae
accusamus dolorem in earum! Esse obcaecati, ut in enim, eaque saepe incidunt
maiores,
eum quisquam perspiciatis consequatur quasi sequi praesentium dignissimos
explicabo unde?
Vitae quod ea accusantium provident fuga c
onsectetur sequi? Iure labore inventore dolores veniam? Dolorem, dolore?</p>
<time>23/12/2020 12:50pm</time>
<address> by venu dasari</address>

</article>
<aside style="width:25%;float:left;border:2px solid
red;margin:20px;height:500px;padding: 10px;">
<h1>computer</h1>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nam labore
quidem a quo? Eius, qui asperiores?
Suscipit eligendi harum adipisci itaque et fugit aliquam? Itaque.</p>
</aside>

You might also like