Skip to main content

Posts

Showing posts from August, 2020

CSS Tutorial 21

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Alignment</title>     <style>         *{         box-sizing: border-box;         }         body{font-family: cursive;}         .container{             background-color: lightyellow;             /* padding: 21px; */             border: royalblue 3px solid;             width: 900px;             margin: 33px auto;         }         .items{             background-color: lightseagreen;             border: ...
Post a Comment
Read more

CSS Tutorial 20

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>BoX Modle</title> </head> <style>     .container{         background-color: rosybrown;         border: royalblue 2px solid;         padding-top: 10px;         padding-left: 20px;         padding-right: 30px;         padding-bottom: 40px;          /* top right bottom left */         /* padding: 5px 7px 8px 10px; */         margin-top: 0px;         margin-left: 0px;         margin-right: 0px;         margin-bottom: 0px;          } </style> <body>     ...
Post a Comment
Read more

CSS Tutorial 19

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Height, width, border and background. </title>     <style>         #firstpara {             background-color: red;             height: 100px;             width: 200px;             border-radius: 11px;             border: green 3px solid;         }         /* border-color: green;     border-style: solid;       border-width: 3px;} */         #secondpara {             height: 100px;             width: 200px;       ...
Post a Comment
Read more

CSS Tutorial 18

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Colers in CSS</title>     <style>         /* this is simple color by name. */         #firstpara{color: darkmagenta;}         /* this is rgb color by red green and blue value. */         #secondpara{color: rgb(92, 214, 182);}         /* this is hexadecemel color by #valuess */         #thirdpara{color: #d83d3d;}     </style> </head> <body>     <h2>This is my first BoX</h2>     <p id="firstpara">This is a paragraph from first BoX</p>     <h2>This is my second BoX</h2>     <p id="secondpara">This is a paragraph from seco...
Post a Comment
Read more

CSS Tutorial 17

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>CSS fonts</title>     <style>         p{             font-family:cursive, Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;             font-size: 33px; /*1/96 pixele of per inch*/            line-height: 5em;         }        span{font-weight: bold;        font-style: italic;}     </style> </head> <body>     <h2>CSS fonts</h2>     <p>let's play with <span>Fonts</span>. It is very exciting.</p> </body> </html>
Post a Comment
Read more

CSS Tutorial 16

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Developer Tools</title>   <style>         h2{background-color: darkkhaki;         color: darkmagenta;}   </style> </head> <body>     <!-- this tools use in google chrome -->     <h2>Chrome Inspect Tools</h2>     <p>we can use Inspect elemente to change our <code></code></p> </body> </html>
Post a Comment
Read more

CSS Tutorial 15

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>CSS selecters</title>     <style>         /* Element selector */         p{color: coral;         font-weight: bold;}         /* ID selector */         #first{color: cyan;}         /* Class selector */         .blueelement{color: blue;}         .bgpink{background-color: pink;}         /* gruping selector */         footer, span{color: darkgreen;}     </style> </head> <body>          <h1>         CSS selecters     </h1>     <p  id="first" ...
Post a Comment
Read more

CSS Tutorial 13

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>CSS Tutorial</title>     <link rel="stylesheet" href="tut 13.css">     <style>         p{color: gold bacol;             background-color: cornflowerblue;}             </style> </head> <body>     <h3>This is CSS Tutorial</h3>     <!-- <p style="color: red; background-color: yellowgreen;" >This Tutorial will teach you everything you need to know about.</p> -->     <p>This Tutorial will teach you everything you need to know about HTML.</p>      </body> </html>
Post a Comment
Read more

HTML Tutorial 12

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>HTML Semantic</title> </head> <body>      <h3>Semantic Elements</h3> <details>     <summary> I heve keys but no doors. I have space but no rooms. you can enter but can't leave. What am I? </summary> A Keyboard A Keyboard A Keyboard A Keyboard A Keyboard     </details> </body> </html>
Post a Comment
Read more

HTML Tutorial 11

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>HTML Entities</title> </head> <body>      <div class="container">     <P>This is a paragraph</P> </div> <div class="container"> <p>This is another     paragraph with two spaces</p> <!-- <p>Paragraph is written like this &lt;p&gt;  </p> --> <p>Paragraph is written like this &lt;p&gt;  </p> <!-- <p>Pound is written like this &pound;  </p> --> <p>Pound is written like this &pound;  </p> <!-- <p>copyright is written like this &copy;  </p> --> <p>copyright is written like this &copy;  </p> <!-- <p>Another character...
Post a Comment
Read more

HTML Tutorial 10

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=     , initial-scale=1.0">     <title>Ids and Classes Tutorial</title> </head> <body>     <h3> Ids and classes Tutorial</h3> <div id="mainbox" class="redbg black border" >     This is main box </div>     <span class="redBg"> </span>     <!-- Select and press ctrl + / to comment -->     <!-- Emmet -->     <!-- . is for class and # is for ID --> <span class="redBg"></span> <span id="mainspan"></span> <div class="redBg black background another Class"></div> <!-- Emmet takes div tag as default --> <div class="black background"></div> <!-- Creating multiple elements using Emmet --> <!-- span.myClass.myClass....
Post a Comment
Read more

HTML Tutorial 9

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Inline & Block Elements</title> </head> <body>      </body> </html>
Post a Comment
Read more

HTML Tutorial 8

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Forms and Input Tages</title> </head> <body>     <H1> This is HTML Forms Tutorial</H1>     <form action="rajendra.php"></form>     <div>         <label for="name">Name:</label>         <input type="text" name="My Name" id="name">     </div>     <div>         Mother's Name: <input type="text" name="Mother Name">     </div>     <div>         Father's Name: <input type="text" name="Father Name">     </div>     <div>         Date Of Birth: <input type="date" name="date...
Post a Comment
Read more

HTML Tutorial 7

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Table and Lists</title> </head> <body>     <!-- unorderd list in three types "disc,circle, squre, " -->     <ul type="squre">         <li>This is my first unordered list</li>         <ol>             <li>sub lists 1</li>         </ol>         <ol>             <li>sub lists 2</li>         </ol>         <ol>             <li>sub lists 3</li>         </ol>         <li>This is my second u...
Post a Comment
Read more

HTML Tutorial 6

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Linkes and Images</title> </head> <body>     <!-- <a href=""></a> ,anchor tag use for target many linkes  --> <a href="https://www.google.com">Go to Google</a> <a href="https://www.facebook.com">Go to facebook</a> <a href="https://www.patrika.com">Go to patrika</a>      </body> </html>
Post a Comment
Read more

HTML Tutorial 5

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">     <title>Heading Paragraphs and Emmet</title> </head> <body> <h1>Heading 1 for Rajendra </h1>     <h2>Heading 2 for Rajendra </h2>     <h3>Heading 3 for Rajendra </h3>    <!-- if you need some example world so you use loram12 for 12 words --> <p> • Incompatible: the chosen fixed size may be too large for a user's available live space, causing the user to scroll in order to view the whole page; a fixedWeb page may also appear too small, leaving unsightly blank spaces.     <!-- <br> tag use for a line break or line change and it is self closing tags -->     <br>• Totalitarian: the Web does not want to run the risk of being under too mu...
Post a Comment
Read more

HTML Tutorial 4

 <!DOCTYPE html> <html lang="en"> <head>     <meta charset="UTF-8">     <meta name="viewport" content="width=device-width, initial-scale=1.0">    <meta name="description" content="It is description">    <!-- meta name tag use = my website show on google with that keywords -->    <meta name="keyword" content="html, html tutorial, web devlopment">    <meta name="robots" content="INDEX, FOLLOW">    <!-- This is how you include external CSS -->    <link rel="stylesheet" href="Rajendra.css">    <title>meta tages and link-JS, CSS file</title>    <!-- This is how you include external Java Script --> <script src="JS Rajendra"></script> </head> <body> This matter into 4th video </body> </html>
Post a Comment
Read more