Monday, September 4, 2023

Creating Sample Student information Form Using HTML



Creating Sample Student  information Form Using HTML

Basic html FORM



How to create registration form in html and css 

form  html css




Program Form        

<html>  
<head>
<title>form create using html and css </title>
<style>
 input[type=email]
{
color:green;
font-family::courier new;
}
input[type=password]
{
    color:red;
  }
 input[type=submit]
  {
      color:white;
     background-color:orange;
   }
input[type=submit]:hover
     {
       background-color:red;
       color:purple;
       }
body
      {
     background-color:#7FFFD4;
     border: 5px solid plum;
     text-align:center;
     }
</style>
</head>
 <body>
<form>
<label for="fn">First Name:</label><br>
<input type="text" id="fn" name="fn" required><br><br>
<label for="ln">Last Name:</label><br>
<input type="text" id="ln" name="ln" required><br><br>
<label for="mn">Middle Name</label><br>
<input type="text" id="mn" name="mn" required><br><br>
<input type="date" name="date" id="date" placeholder="date"><br><br>
<input type="email" name="email" placeholder="user email"><br><br>
<input type="password" id="password" name="password" placeholder="user  password"><br><br>
<textarea  name="comment" cols="30" row="40">user comment</textarea>

<h3>cource</h3>
<select>
<option disabled selected>courser</option>
<option>c</option>
<option>c++</option>
<option>java</option>
<option>data structure</option>
<option>digital marketing</option>
</select><br><br>

<h3>Gender</h3>
<input type="radio" value="f" name="gender">
<label for="f">Female</label><br>
<input type="radio" value="m" name="gender">
<label for="m">Man</label><br>
<input type="radio" value="o" name="gender">
<label for="f">other</label><br><br>
<input type="submit" value="login">
</form>
</body>
</html>

Visit Link 

inline-css.html

Saturday, September 2, 2023

html table tag

                            Html table style



Information:

   <tr> :-  Represents rows.
   <td> :-  used to create data cells.
   <th> :- used to add table headings.                  
   <ol> :-  used to create an ordered list.
   <li>  :-  include html element
 


 program

<!doctype html>

<html>
<head>
    <title>
         table  program
    </title>
    <style>
        tr:nth-child(even)
        {
            background-color: lightgray;
        }
        tr:nth-child(odd)
        {
            background-color: gray;
        }
        li:nth-child(odd)        
        {
            color:red;
        }
        
    </style>
    </head>
    <body>
        <table  border="1" width="10%">
            <tr>
            <th>Roll</th>
            <th>Name</th>
            <th>Address</th>
            </tr>
            <tr>
                <td>1</td>
                <td>Ram</td>
                <td>Satara</td>
            </tr>
            <tr>
                <td>2</td>
                <td>Seeta</td>
                <td>Wai</td>
            </tr>
            <tr>
                <td>3</td>
                <td>om</td>
                <td>pune</td>
            </tr>
        </table>
        <ol>
            <li>Marathi</li>
            <li>science</li>
            <li>English</li>
            <li>Hindi</li>
        </ol>
    </body>
</html>


OUTPUT


html table style


Friday, September 1, 2023

Inline css in html

                      Inline CSS


 Information:

1]   Inline CSS is used to apply a unique style to a single HTML element.

2]   In inline CSS uses the  Style attribute of an HTML element.

3]   Css Apply in a Single element by inline css Technique.

 4]  Inline css also use method to insert style sheets in HTML document


Inline Css 

      Program

<html>

<head>

<title>inline property</title>

</head>

<body>

<h1 style="color:red; background-color:pink;">html</h1>

<p style="color:purple;">hyper text markup language</p>

<h3>Information</h3>s

<dl>INLINE CSS APPLY</dl>

<dd>inline csss use</dd>

<P>Css Apply in a Single element by inline css Technique.<br>

 inline css also use method to insert style sheets in HTML document.

 </P>

 <dl>syntax</dl>

 <dd><h2>element  style="css property:value"</h2></dd>

<h1 style="color:red; background-color:pink">CSS</h1>

<p style="color:purple;">cascading style sheet</p>

</body>

</html>

OUTPUT


inline css

        Visit Link