Jak vytvořit kalkulačku pomocí jazyka HTML: 9 kroků

Matematické výpočty lze provádět na počítači pomocí kalkulačky, ale zajímavější vytvořit kalkulačku přes nejjednodušší HTML kód. Chcete-li to provést, musíte zjistit základy HTML, zkopírujte kód do textového editoru a uložte jej s příponou HTML. Chcete-li využít kalkulačky, musíte otevřít stránku HTML v prohlížeči. Popsané akce budou nejen provádět výpočty v prohlížeči, ale také naučit se některé základy programování.

Kroky

Část 1 z 4:

Základy HTML-Code

jeden. Prozkoumejte hlavní funkce HTML. Popsaný kód, pomocí kterých můžete vytvořit kalkulačku, obsahuje množství syntaxických prvků, které definují různé parametry stránky. Číst Článek o tom, jak se naučit HTML, Nebo si přečtěte, abyste zjistili, co je zde reprezentovaný kód určen.

Html: Tento prvek syntaxe označuje jazyk, na kterém je program napsán. Při psaní kódu lze použít několik programovacích jazyků, takže značka Označuje jazyk HTML.
Hlava: Uvnitř této značky nastaví parametry jiných dat, tj. Takzvaná metadata je indikována. Jako pravidlo tým Slouží k určení parametrů stylistických prvků, jako jsou titulky, titulky a tak dále. Tato značka je druh deštníku, podle kterého je hlavní část programu.
Titul: Tato značka určuje název stránky, která bude zobrazena ve webovém prohlížeči, když jej otevřete.
Tělo bgColor = "#": Tento atribut nastaví barvu barvu pozadí. Číslo, které je zadáno uvnitř citací po symbolu # odpovídá definovaná barva.
Text = "": Slovo, které je zadáno uvnitř citací určuje barvu stránky stránky.
Název formuláře = "": Tento atribut definuje název tvaru, který se používá k vytvoření struktury založené na skutečnosti, že jаvascript je známý název formuláře. V našem příkladu bude hodnota "kalkulačka" použita jako forma formuláře, která povede k vytvoření speciální struktury stránky.
Vstupní typ = "": To je možná hlavní atribut, který určuje, které prvky stránky odpovídají hodnotám zadaným uvnitř uvozovek. Takové prvky mohou být například texty, hesla, tlačítka (jako v našem případě s kalkulačkou) a tak dále.
Hodnota = "": Tento příkaz definuje znaky, které se zobrazují na prvcích zadaných atributu "vstup typu =". V případě kalkulačky jsou tyto symboly čísla (1-9) a matematické operace (+, -, *, /, =).
onclick = "": Tato syntaxe popisuje událost, která musí dojít při stisknutí tlačítka. V případě kalkulačky musíte provést symbol zobrazený na tlačítku, byl chápán systém doslovně. Pokud je například na tlačítku zobrazena číslice 6, musíte zadat následující hodnotu v uvozovkách: Dokument.Kalkulačka.ans.Hodnota + = `6`.
Br: Tato značka iniciuje riziko linky na stránce, takže vše, co je umístěno po této značce, zobrazí se na následujícím řádku.
/ Formulář, / tělo a / htmlToto jsou zavírání značek, které dokončí procesy, které běží odpovídající otevírací značky.

Část 2 ze 4:

Základní kód HTML pro vytvoření kalkulačky

jeden. Zkopírujte kód níže. Chcete-li zvýraznit kód, přesuňte kurzor do levého horního rohu okna, podržte levé tlačítko myši a přetáhněte kurzor do pravého dolního rohu okna, bude zvýrazněn modře. Poté klikněte na "Command + C" (v systému Mac OS) nebo "Ctrl + C" (v systému Windows) pro zkopírování kódu do schránky.

HTML Calculator BGColor = "# 000000" Text = "Gold">> Name = "Calculator"> Type = "Tlačítko" Hodnota = "1" onclick = ".Kalkulačka.ans.Hodnota + = `1` ">> Type =" tlačítko "hodnota =" 2 "onclick =" dokument.Kalkulačka.ans.Hodnota + = `2` ">> Type =" Tlačítko "hodnota =" 3 "onclick =" dokument.Kalkulačka.ans.Hodnota + = `3` ">
 Typ = "Tlačítko" hodnota = "4" onclick = "dokument.Kalkulačka.ans.Hodnota + = `4` ">> typ =" tlačítko "hodnota =" 5 "onclick =" dokument.Kalkulačka.ans.Hodnota + = `5` ">> typ =" Tlačítko "hodnota =" 6 "onclick =" dokument.Kalkulačka.ans.Hodnota + = `6`> type = "tlačítko" hodnota = "7" onclick = "dokument.Kalkulačka.ans.Hodnota + = `7`>
 Typ = "Tlačítko" hodnota = "8" onclick = "dokument.Kalkulačka.ans.Hodnota + = `8` ">> typu =" tlačítko "hodnota =" 9 "onclick =" dokument.Kalkulačka.ans.Hodnota + = `9` ">> typ =" tlačítko "hodnota =" - "onclick =" dokument.Kalkulačka.ans.Hodnota + = `-` - `> type = "tlačítko" hodnota = "+" onclick = "dokument.Kalkulačka.ans.Hodnota + = `+` ">
 Typ = "Tlačítko" hodnota = "*" onclick = "dokument.Kalkulačka.ans.Hodnota + = `*` ">> typ =" tlačítko "hodnota =" / "onclick =" dokument.Kalkulačka.ans.Hodnota + = `/`>> typ = "tlačítko" hodnota = "0" onclick = "dokument.Kalkulačka.ans.Hodnota + = `0` "> type =" reset "hodnota =" reset "> type =" tlačítko "hodnota =" = "onclick =".Kalkulačka.ans.Hodnota = eval (dokument.Kalkulačka.ans.Hodnota) ">
Řešení ISTYPE = "TextField" Jméno = "ANS" hodnota = "">

Část 3 ze 4:

Vytvoření kalkulačky

jeden. Otevřete textový editor. Existuje mnoho podobných programů, ale doporučujeme použít textedit nebo notebook.

V systému Mac OS klepněte na ikonu ve formě zvětšovacího skla (v pravém horním rohu obrazovky) otevřete reflektor. Zadejte "TextEdit" a klikněte na program TextEdit, který bude zvýrazněn modře.
V systému Windows otevřete nabídku Start (v levém dolním rohu obrazovky). V panelu Hledat zadejte "Poznámkový blok" a klikněte na program programu Poznámkový blok, který se zobrazí ve výsledcích vyhledávání (vpravo).

Obrázek s názvem Vytvořit kalkulačku pomocí HTML kroku 4

2. Vložte kopírovaný kód HTML v textovém dokumentu.

Mac OS Klikněte na dokument a klepněte na tlačítko COMMAND + V ". Poté klikněte na "Formát" (v horní části obrazovky) - "Vytvořit textový dokument".

V systému Windows klikněte na dokument a klepněte na tlačítko "Ctrl + V".

Obrázek s názvem Vytvořit kalkulačku pomocí HTML kroku 5

3. Uložte soubor. Chcete-li to provést, klepněte na tlačítko "Soubor" (v levém horním rohu okna) a potom klepněte na tlačítko "Uložit jako" (v systému Windows) nebo "Uložit" (v systému Mac OS).

Obrázek s názvem Vytvořit kalkulačku pomocí HTML kroku 6

4. Přidat rozšíření na název souboru .Html. V okně "Uložit Jak" zadejte název souboru s příponou .Html a potom klepněte na tlačítko "Uložit". Pokud například chcete zavolat soubor "My Maker Cool", uložte jej jako matka kalkulačka.Html.

Část 4 z 4:

Pomocí kalkulačky

jeden. Najděte vytvořený soubor. Chcete-li to provést, zadejte název souboru v Spotlight nebo v řádku vyhledávání nabídky Start (jak je popsáno v předchozí části). Rozšíření .Html nemusíte zadat.