Creating a Google View in an HTML Document

Hello there! Today, I’m going to show you how to create a Google-like view in an HTML document. Follow these simple steps to achieve this:

Steps

Open Notepad++
Start by opening Notepad++ or any other text editor of your choice.
Write the HTML Code
Copy and paste the following HTML code into your text editor:

   <html>
   <head></head>
   <body>
   <p align="center"> 
   <font size=10 face="Berlin Sans FB Demi"><br><br>
   <font color=Blue>G 
   <font color=yellow>o 
   <font color=orange>o
   <font color=red>g
   <font color=Green>l
   <font color=Blue>e
   <br><br>
   <input type="text" size=40> <br> 
   <input type="submit" value="Google Search">
   <input type="submit" value="I'm feeling lucky">
   </body>
   </html>

Save the File with a .HTML Extension
Save the file with a .html extension at your desired location. For example, you can name it google_view.html.
Run with Any Web Browser
Locate the saved file and open it with any web browser (e.g., Google Chrome, Mozilla Firefox, Microsoft Edge).
See the Result
You will see a simple Google-like search page in your web browser.

Code Explanation

<html>: This is the root element of the HTML document.
<head>: This contains meta-information about the document, but it’s empty in this example.
<body>: This is where the content of the HTML document is defined.

<p align="center">: This tag creates a paragraph and centers its content.
<font size=10 face="Berlin Sans FB Demi">: This sets the font size and face for the text.
<font color=Blue>G: These tags set the color of each letter in “Google”.

<br><br>: These tags create line breaks.
<input type="text" size=40>: This creates a text input box with a size of 40 characters.
<input type="submit" value="Google Search">: This creates a submit button with the label “Google Search”.

<input type="submit" value="I'm feeling lucky">: This creates another submit button with the label “I’m feeling lucky”.

By following these steps, you can create a simple HTML page that mimics the appearance of Google’s homepage. Enjoy experimenting with HTML!

Summary

Article Name

Creating a Google View in an HTML Document

Description

Hello there! Today, I'm going to show you how to create a Google-like view in an HTML document. Follow these simple steps to achieve this:

Author

unique21

Publisher Name

UCTC

Publisher Logo

Steps

Code Explanation

Leave a Reply Cancel reply