Jak utworzyć kalkulator za pomocą języka HTML: 9 kroków

Obliczenia matematyczne można wykonać na komputerze za pomocą kalkulatora, ale bardziej interesujące do utworzenia kalkulatora przez najprostszy kod HTML. Aby to zrobić, musisz wymienić fundamenty HTML, skopiuj kod do edytora tekstu i zapisz go za pomocą rozszerzenia HTML. Aby skorzystać z kalkulatora, musisz otworzyć stronę HTML w przeglądarce. Opisane działania będą nie tylko wykonywać obliczeń w przeglądarce, ale także dowiedz się niektóre podstawy programowania.

Kroki

Część 1 z 4:

Podstawy kodu HTML

jeden. Przeglądaj główne funkcje HTML. Opisany kod, dzięki którym możesz utworzyć kalkulator, zawiera wiele elementów składni, które definiują różne parametry stron. Czytać Artykuł na temat sposobu nauki HTML, Lub czytaj, aby dowiedzieć się, na co tutaj reprezentowany kod jest przeznaczony.

Html: Ten element składni wskazuje język, na którym program jest zapisany. Podczas pisania kodu można użyć kilku języków programowania, więc znacznik Wskazuje język HTML.
Głowa: Wewnątrz tego znacznika określa parametry innych danych, czyli tak zwane metadane są wskazane. Z reguły zespół Używane do określenia parametrów elementów stylistycznych, takich jak nagłówki, napisy i tak dalej. Ten tag jest rodzajem parasolowym, w którym główna część programu jest.
Tytuł: Ten znacznik określa nazwę strony, która zostanie wyświetlona w przeglądarce internetowej, gdy ją otworzysz.
Ciało bgolor = "#": Ten atrybut ustawia kolor tła kolorów. Numer wprowadzany do cytatów po symbolu # odpowiada zdefiniowany kolor.
Tekst = "": Słowo wprowadzone wewnątrz cytat określa kolor strony strony.
Nazwa formularza ="": Ten atrybut określa nazwę kształtu, który służy do tworzenia struktury na podstawie faktu, że jаvascript jest znany nazwy formularza. W naszym przykładzie wartość "Kalkulator" zostanie wykorzystana jako forma formularza, która doprowadzi do utworzenia specjalnej struktury strony.
Typ wejścia ="": Jest to chyba główny atrybut, który określa, które elementy strony odpowiadają wartości wprowadzone w cytatach. Na przykład takie elementy mogą być tekstami, hasłami, przyciskami (jak w naszym przypadku za pomocą kalkulatora) i tak dalej.
Wartość ="": Polecenie to określa znaki wyświetlane na elementach określonych przez atrybut "Wpisz Type =". W przypadku kalkulatora symbole te są liczbami (1-9) i operacje matematyczne (+, -, *, /, =).
onclick ="": Ta składnia opisuje zdarzenie, które musi wystąpić po naciśnięciu przycisku. W przypadku kalkulatora musisz wykonać symbol wyświetlany na przycisku, zrozumiano przez system dosłownie. Na przykład, jeśli na przycisku wyświetlany jest cyfra 6, musisz wprowadzić następującą wartość w notatkach: Dokument.Kalkulator.ans.Wartość + = `6`.
Br: Ten znacznik inicjuje ryzyko linii na stronie, więc wszystko, co znajduje się po tym znaczniku zostanie wyświetlona na następującej linii.
/ Forma, / ciało i / html: Są to znaczniki zamykające, które uzupełniają procesy prowadzące odpowiednie znaczniki otwierające.

Część 2 z 4:

Podstawowy kod HTML do utworzenia kalkulatora

jeden. Skopiuj poniższy kod. Aby podświetlić kod, przesuń kursor do lewego górnego rogu okna, przytrzymaj lewym przycisku myszy i przeciągnij kursor do prawego dolnego rogu kodu okna, zostanie podświetlony na niebiesko. Następnie kliknij "Polecenie + C" (w systemie Mac OS) lub "Ctrl + C" (w systemie Windows), aby skopiować kod do schowka.

Kalkulator HTML BGColor = "# 000000" Tekst = "ZŁOTO"> Nazwa ="Kalkulator" > Typ ="Przycisk" Wartość ="jeden" onclick ="Dokument.Kalkulator.ans.Wartość + = `1`"> Typ ="Przycisk" Wartość ="2" onclick ="Dokument.Kalkulator.ans.Wartość + = `2`"> Typ ="Przycisk" Wartość ="3" onclick ="Dokument.Kalkulator.ans.Wartość + = `3`">
 Typ ="Przycisk" Wartość ="cztery" onclick ="Dokument.Kalkulator.ans.Wartość + = `4`"> Typ ="Przycisk" Wartość ="pięć" onclick ="Dokument.Kalkulator.ans.Wartość + = `5`"> Typ ="Przycisk" Wartość ="6" onclick ="Dokument.Kalkulator.ans.Wartość + = `6`"> Typ ="Przycisk" Wartość ="7" onclick ="Dokument.Kalkulator.ans.Wartość + = `7`">
 Typ ="Przycisk" Wartość ="osiem" onclick ="Dokument.Kalkulator.ans.Wartość + = `8`"> Typ ="Przycisk" Wartość ="dziewięć" onclick ="Dokument.Kalkulator.ans.Wartość + = `9`"> Typ ="Przycisk" Wartość ="-" onclick ="Dokument.Kalkulator.ans.Wartość + = `-`"> Typ ="Przycisk" Wartość ="+" onclick ="Dokument.Kalkulator.ans.Wartość + = `+`">
 Typ ="Przycisk" Wartość ="*" onclick ="Dokument.Kalkulator.ans.Wartość + = `*"> Typ ="Przycisk" Wartość ="/" onclick ="Dokument.Kalkulator.ans.Wartość + = `/`"> Typ ="Przycisk" Wartość ="0" onclick ="Dokument.Kalkulator.ans.Wartość + = `0`"> Typ ="Resetowanie" Wartość ="Resetowanie"> Typ ="Przycisk" Wartość ="=" onclick ="Dokument.Kalkulator.ans.Wartość = Eval (Dokument.Kalkulator.ans.Wartość)">
Rozwiązanie istype ="Pole tekstowe" Nazwa ="ans" Wartość ="">

Część 3 z 4:

Tworzenie kalkulatora

jeden. Na komputerze otwórz edytor tekstu. Istnieje wiele podobnych programów, ale zalecamy korzystanie z Textedit lub Notebooka.

W systemie Mac OS kliknij ikonę w postaci lupy (w prawym górnym rogu ekranu), aby otworzyć reflektor. Wpisz "Textedit" i kliknij program TextEdit, który zostanie podświetlony na niebiesko.
W systemie Windows otwórz menu Start (w lewym dolnym rogu ekranu). W pasku wyszukiwania wprowadź "Notatnik" i kliknij program Notepad, który zostanie wyświetlony w linii wyników wyszukiwania (po prawej).

Obraz zatytułowany Utwórz kalkulator za pomocą HTML Krok 4

2. Włóż skopiowany kod HTML w dokumencie tekstowym.

Mac OS Kliknij dokument i kliknij "Polecenie + V". Następnie kliknij "Format" (u góry ekranu) - "Utwórz dokument tekstowy".

W systemie Windows kliknij dokument i kliknij "Ctrl + V".

Obraz zatytułowany Utwórz kalkulator za pomocą HTML Krok 5

3. Zapisz plik. Aby to zrobić, kliknij "Plik" (w lewym górnym rogu okna), a następnie kliknij "Zapisz jako" (w systemie Windows) lub "Zapisz" (w systemie Mac OS).

Obraz zatytułowany Utwórz kalkulator za pomocą HTML Krok 6

cztery. Dodaj rozszerzenie do nazwy pliku .Html. W oknie "Zapisz, jak" wprowadź nazwę pliku z rozszerzeniem .HTML, a następnie kliknij "Zapisz". Na przykład, jeśli chcesz zadzwonić do pliku "My Maker Cool", zapisz go jako kalkulator matki.Html.

Część 4 z 4:

Za pomocą kalkulatora

jeden. Znajdź utworzony plik. Aby to zrobić, wprowadź nazwę pliku w centrum uwagi lub w wierszu wyszukiwania menu Start (jak opisano w poprzedniej części). Ekspansja .HTML nie musi wprowadzać.