How to build a computer using HTML

Author: John Stephens
Date Of Creation: 22 January 2021
Update Date: 1 July 2024
Anonim
HTML Tutorial - How to Make a Super Simple Website
Video: HTML Tutorial - How to Make a Super Simple Website

Content

Besides countless built-in calculators, you can also do math on your desktop using HTML code to build yourself. To create a computer from HTML, you need to learn some basic knowledge of this programming language and then copy the necessary code into a text editor and save it as HTML. You can now open the HTML document in your favorite browser and start using your computer. Just like that, you not only can do math in the browser, but also learn the basics of programming arts too!

Steps

Part 1 of 4: Understand your code

  1. Learn the functions of each html. The code you use to build your computer is composed of many syntax fragments. They combine to create many different elements of the document. Click here to learn how to familiarize yourself with the process, or read on to see what each line of text does in the code you will use.
    • html: This portion of the syntax tells the rest of the document what the language is to be used. In programming there are many languages ​​used and let the rest of the document know it's written with - that's correct - html!
    • head: Tell the document that the content below is the data about the data, also known as "metadata" (metadata). Comeinand often used to define a stylistic element of the document, such as headings, headings, etc. It can be thought of as an umbrella covering the rest of the code.
    • title: This is where you will name your document. This attribute determines the title of the document when opened in the html browser.
    • body bgcolor = "#": This attribute specifies the background and body color of the code. The number in quotation marks, after the # sign corresponds to a specified color in the html
    • text = "": The word enclosed in quotation marks specifies the text color in the document.
    • form name = "": This attribute specifies the name of the form. Thanks to it, Javascript will identify what the form in question is and apply the structure built up from the form. Here, for example, we use the Calculator form and it will create a separate structure for the document.
    • input type = "": This is where the action takes place. The "input type" property tells the document what type of input the values ​​in the rest of the brackets are in. It could be text, passwords, buttons (for computers), etc.
    • value = "": This command tells the document what the content is contained in the input type specified above. With a calculator, that would be the digits (1-9) and math (+, -, *, /, =).
    • onClick = "": This syntax describes an event - tells the document something happens when someone presses a button. With a computer, we want each button pressed to be displayed. For example, with "6" button, we will put document.calculator.ans.value + = '6' between quotes.
    • br: This tag helps you to return a line in the document. Any content that follows it will appear on the line below the content before it.
    • / form, / body, and / html: these commands tell the document at this point, the corresponding commands initialized will terminate.
    advertisement

Part 2 of 4: Basic HTML computer programming


  1. Copy the following code. Select the text in the box below by holding and dragging from the upper left corner of the box to the lower right corner. The entire text will turn green. Press "Command + C" on a Mac or "Ctrl + C" on a PC to copy the code to the clipboard. advertisement

Part 3 of 4: Create your computer


  1. Open a text editor on your computer. There are many options for you, but for convenience and quality, TextEdit and Notepad are the two applications to use.
    • On the Mac, click the magnifying glass in the upper right corner of the screen to open Spotlight. In Spotlight, type TextEdit and click on the program: it must be highlighted in green.
    • On your PC, open the Start menu in the lower left corner of the screen. Type Notepad in the search bar and click the Notepad app that appears in the results bar to the right.

  2. Paste the computer-generated HTML code into the document.
    • On the Mac, click on the body of the document and press "Command + V". Next, you need to click on the item "Format" (format) at the top of the screen and "Make Plain Text" (Create blank text) after pasting.
    • On the PC, click on the document body and press "Ctrl + V".
  3. Save the file. Click the "File" button in the upper left corner of the window and on the drop-down menu, click "Save As ..." (Save As) - on PC, or "Save ..." (Save) - on Mac
  4. Add the HTML extension for the filename. In the "Save As ..." menu, type the filename with the ".html" extension, then click "Save". For example, to call the file First Computer you would save as "MayTinhDauTien.html".

Part 4 of 4: Using your computer

  1. Find the file you just created. Enter the filename in Spotlight or the Start menu search bar as shown in the previous step. You do not need to enter the "html" extension.
  2. Click to open the file. The default browser will open the computer on a new website.
  3. Click the buttons on the computer to use it. The calculation results will appear in the results bar. advertisement

Advice

  • You can embed this computer in the web page if you like.
  • You can also use style properties to change the look of your computer.