How to Create Websites by using HTML

By Faryal Anum
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8" />
  <title>HTML FORM</title>
  <link rel="stylesheet" type="text/css" href="css/reset.css" />
  <link rel="stylesheet" type="text/css" href="css/mycss.css" />
    <style type="text/css">
  body {
    color: purple;
    background-color: #d8da3d }
  </style>

</head>

<body>
<script type="text/javascript">
function alertUser(msg) {
alert(msg);
}
</script>
</head>
<body onload="alertUser('Nice to Meet You!')">
<div style="text-align:center;padding:10px;">
<h1>Nice to Meet You.</h1>
<p><a href="JavaScript:self.close();">Close</a></p>
</div>

<h3>Fast Food</h3>
<p>Fast food is a type of mass-produced food designed for commercial resale and with a strong priority placed on "speed of service" versus other relevant factors involved in culinary science.
 Fast food was originally created as a commercial strategy to accommodate the larger numbers of busy commuters, travelers and wage workers who often did not have the time to sit down at a public house or diner and wait for their meal. By making speed of service the priority, this ensured that customers with strictly limited time (a commuter stopping to procure dinner to bring home to their family,</p>
<BR/>
<BR/>
<img src="https://banner2.cleanpng.com/20180408/yte/kisspng-fast-food-restaurant-junk-food-kfc-hamburger-junk-food-5aca9ac191eb27.0987335415232273295977.jpg"/>
<BR/>
<BR/>
<BR/>
<BR/>
<fieldset>

          <legend>Personal Information</legend>

         First name:
<input type = "text" name = "first_name" />
         <br>
         Last name:
<input type = "text" name = "last_name" />
<br>
<BR/>
Gender:
<BR/>
         <input type="radio" name="gender" value="male"> Male
<br>
         <input type="radio" name="gender" value="female"> Female
         <br>
<BR/>
Account No:
<input type="number" name="account" /><br />
         
         Date of Birth:
      <input type="date" name="birthday" />
  
         </fieldset>

        <hr />
        <table>
          <tr>
<h4>Pizza Menu</h4>
            <td>Small</td>
            <td>700</td>
          </tr>
          <tr>
            <td>Medium</td>
            <td>1000</td>
          </tr>
          <tr>
            <td>Large</td>
            <td>1700</td>
          </tr>
          <tr>
 
        </table>
        Your Price<br />
        <input name="price" size="8" readonly="readonly" />
      </div>
      <div class="forms2">
        <fieldset>
<legend>Pizza size </legend>
          <select name="size" size="2">
            <option>Select Pizza Size</option>
            <option value="1">Small</option>
            <option value="2">Medium</option>
            <option value="3">Large</option>
           </select>
        
        </fieldset>
        <fieldset>
          <legend>Cheeses</legend>
          <input type="radio" name="cheese" value="1" />Mozzarella
          <input type="radio" name="cheese" value="2" />Reduced Fat
          <input type="radio" name="cheese" value="3" />Feta
        </fieldset>
        <fieldset>
          <legend>Sauces</legend>
          <input type="radio" name="sauce" value="1" />Pizza Sauce
          <input type="radio" name="sauce" value="2" />BBQ Sauce
          <input type="radio" name="sauce" value="3" />Garlic Sauce
        </fieldset>
        <fieldset>
          <legend>Special Instructions</legend>
          <textarea name="instructions" rows="3" cols="42"></textarea>
       </fieldset>
         <table>
          <tr>  
<h4>Shawarma Menu</h4>
            <td>Small</td>
            <td>60</td>
          </tr>
          <tr>
            <td>Medium</td>
            <td>90</td>
          </tr>
          <tr>
            <td>Large</td>
            <td>120</td>
          </tr>
          <tr>
 
        </table>
        Your Price<br />
        <input name="price" size="8" readonly="readonly" />
      </div>
      <div class="forms2">
  <BR/>
        <fieldset>
<legend>Shawarma size </legend>
          <select name="size" size="2">
            <option>Select Shawarma Size</option>
            <option value="1">Small</option>
            <option value="2">Medium</option>
            <option value="3">Large</option>
           </fieldset>
          </select>
  </div>
  <fieldset>
          <legend>Sauces</legend>
          <input type="radio" name="sauce" value="1" />ketchup
          <input type="radio" name="sauce" value="2" />mayonnaise
          <input type="radio" name="sauce" value="3" />Garlic Sauce
        </fieldset>
  
            </div>
    </div>
<fieldset>
          <legend>Special Instructions</legend>
          <textarea name="instructions" rows="3" cols="42"></textarea>
       </fieldset>
   <fieldset>
    <table>
          <tr>
  
<h4>Drinks</h4>
            <td>smalll</td>
            <td>40</td>
          </tr>
          <tr>
            <td>Medium</td>
            <td>60</td>
          </tr>
          <tr>
            <td>Large</td>
            <td>100</td>
          </tr>
          <tr>
 
        </table>
        Your Price<br />
        <input name="price" size="8" readonly="readonly" />
      </div>
      
  <BR/>
  </fieldset>
        <fieldset>
<legend>Drink size </legend>
          <select name="size" size="2">
            <option>Select Drink Size</option>
            <option value="1">Small</option>
            <option value="2">Medium</option>
            <option value="3">Large</option>
           </fieldset>
   </fieldset>
          </select>
 </div>
 </div>

          <legend>Special Instructions</legend>
          <textarea name="instructions" rows="3" cols="42"></textarea>
  </fieldset>
    <fieldset>
<input type="submit" value="PLACE YOUR ORDER" />
        <input type="reset" value="START OVER" />
</fieldset>
</div>
 </form>
 <H4>Date</H4>
<!-- Sign and date the page, ! -->
<address> Made 4 April 2021<br>
  by myself.</address>
   <BR/>
 <H5>Time<H5/>
 <!-- Sign and time the page, ! -->
<address> 13:58 <br>
  by myself.</address>
</body>
</html>

This is the complete Fast food website. I made this website with the help of Notepad++.

Language: Html, JavaScript, and CSS. 



Post a Comment

0 Comments