Hur man skapar en kalkylator med HTML

Författare: John Stephens
Skapelsedatum: 21 Januari 2021
Uppdatera Datum: 14 Maj 2024
Anonim
How to make calculator using html and css
Video: How to make calculator using html and css

Innehåll

I den här artikeln: Förstå koden Skriva kalkylarens grundkod Skapa räknaren Använd kalkylatorn11 Referenser

Det finns många sätt att göra beräkningar på din dator med den inbyggda kalkylatorn, men du kan också skapa din egen med bara HTML-kod. För att göra detta måste du lära dig grunderna i HTML innan du kopierar den nödvändiga koden till en e-fil som du sparar med filnamnstillägg.html. Öppna sedan filen i din favoritwebbläsare för att komma åt miniräknaren. Med den här tekniken kan du göra beräkningar direkt i din webbläsare medan du lär dig grunderna i datorprogrammeringen.


stadier

Del 1 Förstå koden



  1. Förstå hur koden fungerar. Koden du kommer att använda för att skapa kalkylatorn är baserad på små kodstycken som arbetar med varandra för att definiera olika delar av dokumentet. Du kan lära dig mer om HTML genom att klicka på den här länken eller så kan du läsa vad varje rad gör i koden du ska använda för miniräknaren.
    • HTML: den här kodkoden indikerar för resten av dokumentet vilket språk som används. Många olika programmeringsspråk används och taggen indikerar för resten av dokumentet att den här gången är det HTML som du använder.
    • huvud : detta berättar för dokumentet att följande information är data som också kallas "metadata". Taggen används vanligtvis för att definiera stilistiska element i dokumentet, till exempel titel, rubriker etc. Det är som ett paraply under vilket resten av koden definieras.
    • titel : Detta är den titel du kommer att ge till dokumentet. Den här taggen används för att visa dokumentets titel när det öppnas i webbläsaren.
    • body bgcolor = "#" : Detta ställer in en bakgrundsfärg för dokumentet. Det antal som visas efter den skarpa motsvarar en förutbestämd färg.
    • = '' : Ordet i citattecken anger färgen på e i dokumentet.
    • formnamn = "" : Detta attribut anger namnet på det formulär som kommer att användas för strukturen på det som kommer efter så att JavaScript kan veta vilken form som talas. Till exempel är formulärnamnet som vi använder "miniräknare" som skapar dokumentets specifika struktur.
    • ingångstyp = "" : det är här åtgärden kommer att äga rum. Attributet "input type" berättar för dokumentet värdetyp för e i resten av parenteserna. Till exempel kan det vara e, ett lösenord, en knapp (som det kommer att vara för vår kalkylator) och så vidare.
    • value = "" : Detta attribut berättar för dokumentet vad "input type" -attributet kommer att innehålla. För en kalkylator visar du siffrorna från 1 till 9 och de aritmetiska tecknen (+, -, *, /, =).
    • onclick = "" : Den här koden beskriver en händelse som säger till dokumentet att något måste hända när knappen aktiveras. För en kalkylator vill du visa numret som motsvarar knappen som användaren har tryckt på. Till exempel, om knapp 6 är aktiverad, vill du placera document.calculator.in.value + = 6 mellan citattecken.
    • br : det är en tagg som indikerar en radbrytning, resten av koden som kommer nästa kommer att visas en rad nedan.
    • / form, / body och / html Dessa stängningstaggar berättar för webbläsaren att taggarna som du öppnade tidigare nu är färdiga och stängda.

Del 2 Skriv kalkylatorns grundkod

Kopiera koden nedan. Välj e nedan genom att hålla markören intryckt från det övre vänstra hörnet av rutan och dra den till det nedre högra hörnet så att hela e visas blå. Tryck sedan på "Kommando + C" på en Mac eller "Ctrl + C" på en PC för att kopiera e.


HTML-kalkylator

Resultatet är

Del 3 Skapa kalkylatorn




  1. Öppna en e-fil på datorn. Det finns många program som du kan använda, men för kvalitetsskäl rekommenderas att du använder Edit eller Notepad.
    • På en Mac klickar du bara på förstoringsglaset längst upp till höger på skärmen för att öppna Spotlight. När du är öppen skriver du Redigera och klicka på programmet som ska väljas i blått.
    • Klicka på knappen på en PC start nedre vänster. Skriv i sökfältet Anteckningar och klicka på applikationen som ska visas i resultaten.


  2. Klistra in HTML-koden i dokumentet.
    • Klicka på en Mac på en Mac och tryck på "Kommando + V". Du bör sedan klicka på format längst upp på skärmen och sedan på Visa i enkel e efter klistra in koden.
    • Klicka på en dator på en PC och klistra in koden genom att trycka på "Ctrl + V".


  3. Spara filen. Klicka bara på knappen fil längst upp till vänster i fönstret och sedan vidare Spara som ... på en PC eller Spara ... på en Mac i rullgardinsmenyn som visas.


  4. Lägg till HTML-förlängningen. En gång i menyn skriver du filnamnet följt av ".html" innan du klickar rekord. Om du till exempel vill kalla den här filen "min första kalkylator" kan du ge den som namn: "MyPremierCalculette.html".

Del 4 Använda miniräknaren



  1. Hitta HTML-filen. Skriv bara filnamnet i Spotlight på Mac eller i sökfältet i Windows Start-menyn. Det är inte nödvändigt att skriva filändelsen.


  2. Klicka på den för att öppna den. Din standardwebbläsare bör öppna kalkylatorn i en ny flik.


  3. Klicka på knapparna för att använda den. Resultaten från dina beräkningar ska visas i fältet för detta ändamål.

Andra avnitt Medan kommunikation är avgörande för alla porter, är det ärkilt å i volleyboll. Brit på korrekt kommunikation kan hindra ditt lag förmåga att ...

Andra avnitt När ekonomin tankar tappar fler männikor ina jobb - och det tar längre tid för dem att hitta nya. Här är några idéer om hjälper dig att hanter...

Läsa Idag