Skip to main content

Posts

Showing posts from December, 2021
Use < article > Tag     < section >         < h1 > This is Airtical Element </ h1 >         < article >             < h2 > Computer </ h2 >             < p > Lorem ipsum dolor sit amet consectetur adipisicing elit. Ipsam excepturi beatae voluptates maxime, voluptate eligendi ratione, eveniet consectetur minus provident nihil doloremque in asperiores ad magni molestias, rerum sequi illum voluptas saepe. Suscipit, unde! Cumque minus magni ut tenetur non autem laudantium? Magni rerum asperiores deleniti quam repudiandae. Labore iste temporibus sequi ab vero reprehenderit totam maiores numquam eos libero. </ p >         </ article >         < article >             < h2 > Laptop </ h2 >             < p ...
Use <area>,usemap Attribute   < section >         < img src = "New2.jpg" alt = "Nasa" usemap = "#sunlight" >       < map name = "sunlight" >         < area shape = "circle" coords = "107,84,42" href = "Solar.mp4" alt = "sun" target = "_blank" title = "Click and show vedio solor system"         >         < area shape = "circle" coords = "292,324,64" href = "Earth.mp4" alt = "Earth" target = "_blank" title = "Click and show Earth vedio"         >         < area shape = "circle" coords = "102,411,64" href = "Jupiter.mp4" alt = "jupetar" target = "_blank" title = "Click and show Juputar vedio"         >       </ map >     </ section >  
Use <address> and link email with <a> Tag   < address class = "ad" >         < h2 > This is my Address : </ h2 >         < p > Ismail Sardar(CEO) </ p >         Mobile :01398xxxx < br >         Email : < a href = "mailton:ismailsardar540@gmail.com" > ismailsardar540@gmail.com </ a >< br >         Office Address: < br >         Box 1280, Dhanmondi, Dhaka.     </ address >  
Use <a>,<img>,<button> Tag < body >     < a href = "https://www.w3schools.com/tags/att_a_download.asp" target = "_blank" > w3schools </ a >< br >< br >     < img src = "ds.jpg" alt = "SR" width = "350px" height = "300px" class = "tt" >< br >     < span > If you want this photo. Click this button : </ span >     < a href = "ds.jpg" download = "download" >         < button type = "button" class = "bt" >          Download         </ button >     </ a >  
                                           Use  <SVG> Tag < h1 > The svg element </ h1 > < svg width = "300" height = "200" >   < polygon points = "100,10 40,198 190,78 10,78 160,198"   style = "fill:lime;stroke:purple;stroke-width:5;fill-rule:evenodd;" />   Sorry, your browser does not support inline SVG. </ svg > < h1 > The svg element </ h1 > < svg height = "130" width = "500" >   < defs >     < linearGradient id = "grad1" x1 = "0%" y1 = "0%" x2 = "100%" y2 = "0%" >       < stop offset = "0%"       style = "stop-color:rgb(255,255,0);stop-opacity:1" />       < stop offset = "100%"       style = "stop-color:rgb(255,0,0);stop-opacity:1" />     </ linearGradient >   </ de...
Use <  picture >,< source > Tag  < picture >       < source media = "(min-width: 900px)" srcset = "hp.jpg" >       < source media = "(min-width: 600px)" srcset = "gt.jpg" >       < img src = "rt.png" alt = "My Photo" >     </ picture >  
Use <meter>,< progress >,<q>,< ruby > Tag   <!-- use <meter> Tag -->   < section >     < h4 > This is Meter Tag </ h4 >     < label for = "html" > HTML : </ label >     < meter id = "html" value = "60" min = "0" max = "100" > 60% </ meter > 60% < br >     < label for = "css" > CSS : </ label >     < meter id = "css" value = "10" min = "0" max = "100" > 10% </ meter > 10% < br >     < p >< strong > Note: </ strong > The meter tag is not supported in Edge 12 (or earlier). </ p >     < h4 > This is progress Tag </ h4 >     < label for = "js" > Java : </ label >     < progress id = "js" value = "10" max = "100" > 10% </ progress >   </ section >< br >   ...
Use <Select>,<optgroup>,<ption> Tag   < span >     < label for = "car" >< strong > Choose a CAR : </ strong ></ label >     < select name = "car" id = "car" >       < optgroup label = "Mearsedis CAR" >         < option value = "Bang 1534" > Bang 1534-u9 </ option >         < option value = "Bang 15309" > Bang 1530-6p </ option >         < option value = "Bang 15649" > Bang 15609-j8 </ option >         < option value = "Bang 15404" > Bang 15404 </ option >       </ optgroup >       < optgroup label = "BMW CAR" >         < option value = "Squreb77-G8" > Squreb77-G8 </ option >         < option value = "Squreb77-G9" > Squreb70J-G9 </ option >   ...
Use  <nav>,<figure>,<ifrem>,<samp>,<var> Tag < html lang = "en" > < head >   < meta charset = "UTF-8" >   < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >   < style >     header {       text-align : center ;     }     body {       background-color : rgb ( 196 , 152 , 72 );     }     .agp {       width : 100% ;       height : 250px ;    }     .fcss {     border : 3px solid red ;     border-radius : 5px ;     padding : 5px ;     margin : 2px ;     width : 50% ;    }     .fs {       text-align : center ;     }     .t1 , .t2 , .t3 , .t4 {       background-colo...
Use <figure>,<figcaption> With CSS < html lang = "en" > < head >   < meta charset = "UTF-8" >   < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >   < style >     body {       background-color : rgb ( 196 , 152 , 72 );     }     .agp {       width : 100% ;       height : 250px ;    }     .fcss {     border : 3px solid red ;     border-radius : 5px ;     padding : 5px ;     margin : 2px ;     width : 50% ;    }     .fs {       text-align : center ;     }   </ style >   < base href = "media/" >   < title > fieldset tag </ title > </ head > < body >   < figure class = "fcss" > ...
Use <fieldset>,<legend> tag <! DOCTYPE html > < html lang = "en" > < head >   < meta charset = "UTF-8" >   < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >   < style >     body {       background-color : rgb ( 196 , 152 , 72 );     }     .pinfo {       background-color : skyblue ;     }     .cinfo {       background-color : yellowgreen ;     }   </ style >   < title > fieldset tag </ title > </ head > < body >   <!-- use fieldset and legend tag -->   < form action = "" >     < fieldset class = "pinfo" >       < legend > Personal Info </ legend >< br >     < label for = "name" > First Name...
Use <(dl,dt,dd)>,<del>,<ins>,<details>,<summary> and <dialog> tag   <! DOCTYPE html > < html lang = "en" > < head >   < meta charset = "UTF-8" >   < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >   < style >     body {       background-color : darkgray ;     }     summary {       background-color : yellow ;     }     dialog {       background-color : saddlebrown ;       border-radius : 20% ;     }   </ style >   < title > Document </ title > </ head > < body >   <!-- use di,dt,dd tag -->   < dl >     < dt > Computer : </ dt >     < dd >       < del > Lor...
You want to crreat defenison than you have to use <dl>,<dt>,<dd> tag   < head >   < meta charset = "UTF-8" >   < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >   < title > Document </ title > </ head > < body >   < dl >     < dt > Computer : </ dt >     < dd >       Lorem ipsum dolor sit amet consectetur adipisicing elit. Dicta ipsam architecto dolorum nisi ut quibusdam atque vel quae eum. Explicabo quos laboriosam accusantium beatae expedita, iure nihil rem fugit quas.     </ dd >     < dt > Laptop : </ dt >     < dd >       Lorem ipsum dolor, sit amet consectetur adipisicing elit. Eveniet repudiandae magnam itaque, quaerat dignissimos hic quo neque sapiente officiis, aliq...
Use <datalist> tag and attribute < head >   < meta charset = "UTF-8" >   < meta http-equiv = "X-UA-Compatible" content = "IE=edge" >   < meta name = "viewport" content = "width=device-width, initial-scale=1.0" >   < style >     body {       background-color : darksalmon ;     }   </ style >   < title > datalist </ title > </ head > < body >   < h1 > This is DataList Element </ h1 >   < form action = "" >     < label for = "browser" >< b > Choose your fevriot browser in this list </ b ></ label >< br >< br >     < input list = "browsers" id = "browser" name = "browser" placeholder = "choose browser" >     <!-- list or id same value  -->     < datalist id = "browsers" >       < option value = "Corm" >...