60 parasta HTML-haastattelun kysymystä ja vastausta (2025)

Tässä on HTML-haastattelukysymyksiä ja vastauksia niin uusille kuin kokeneille hakijoille unelmatyönsä saamiseksi.

Ilmainen PDF-lataus: HTML-haastattelukysymykset

---

1) Mikä on HTML?

HTML on lyhenne sanoista HyperText Markup Language ja se on World Wide Webin kieli. Se on tavallinen tekstin muotoilukieli, jota käytetään sivujen luomiseen ja näyttämiseen Webissä. HTML-dokumentit koostuvat kahdesta asiasta: sisällöstä ja tunnisteista, jotka muotoilevat sen oikein näyttämään sivuilla.

---

2) Mitä tunnisteet ovat?

Sisältö sijoitetaan HTML-tagien väliin, jotta se muotoillaan oikein. Se käyttää vähemmän kuin -symbolia (<) ja suurempi kuin -symbolia (>). Kenoviivasymbolia käytetään myös lopetustunnisteena. Esimerkiksi:

<strong>sample</strong>

---

3) Onko kaikki HTML-tunnisteet pareittain?

Ei, on yksittäisiä HTML-tageja, jotka eivät tarvitse sulkevaa tunnistetta. Esimerkkejä ovat tag ja tunnisteet.

---

4) Mitä yleisimpiä luetteloita voidaan käyttää sivun suunnittelussa?

Voit lisätä minkä tahansa seuraavista luettelotyypeistä tai niiden yhdistelmän:
- tilattu lista
– järjestämätön lista
– määritelmäluettelo
– valikkoluettelo
– hakemistoluettelo
Jokainen näistä luettelotyypeistä käyttää eri tagijoukkoa luomiseen

---

5) Kuinka lisäät kommentin HTML:ään?

HTML:n kommentit alkavat " ”. Esimerkiksi:

<!-- A SAMPLE COMMENT -->

---

6) Näkyvätkö kaikki merkkientiteetit oikein kaikissa järjestelmissä?

Ei, on joitakin merkkikokonaisuuksia, joita ei voida näyttää, kun käyttöjärjestelmän jossa selain on käynnissä, ei tue merkkejä. Kun näin tapahtuu, nämä merkit näytetään laatikoina.

---

7) Mikä on kuvakartta?

Kuvakartan avulla voit linkittää useille eri verkkosivuille yhdellä kuvalla. Voit määrittää kuviin muotoja, jotka haluat tehdä osaksi kuvakartoitusta.

---

8) Mitä hyötyä on tyhjän tilan kutistamisesta?

Tyhjät välilyönnit ovat tyhjää välilyöntimerkkiä, jota käsitellään yhtenä välilyöntinä HTML:ssä. Koska selain tiivistää useita välilyöntejä yhdeksi väliksi, voit sisentää tekstirivejä murehtimatta useista välilyönneistä. Tämän avulla voit järjestää HTML-koodin paljon luettavampaan muotoon.

---

9) Voidaanko attribuuttiarvot asettaa mihin tahansa vai onko olemassa tiettyjä arvoja, jotka ne hyväksyvät?

Jotkin attribuuttiarvot voidaan asettaa vain ennalta määritettyihin arvoihin. Muut attribuutit voivat hyväksyä minkä tahansa numeerisen arvon, joka edustaa koon pikselien määrää.

---

10) Kuinka lisäät tekijänoikeussymbolin selainsivulle?

Voit lisätä tekijänoikeussymbolin kirjoittamalla © tai & #169; HTML-tiedostossa.

---

11) Kuinka luot linkkejä saman sivun osiin?

Linkit voidaan luoda käyttämällä tagia, viitaten käyttämällä numero (#) symbolia. Esimerkiksi yksi rivi voi olla BACK TO TOP , mikä johtaisi siihen, että sanat "TAKAISIN ALKUUN" ilmestyvät verkkosivulle ja linkittävät kirjanmerkkiin, jonka nimi on topmost. Luo sitten erillinen tagikomento, kuten jonnekin saman verkkosivun yläosaan, jotta käyttäjä linkitetään kyseiseen kohtaan, kun hän napsauttaa TAKAISIN ALKUUN.

---

12) Onko mitään tapaa pitää luetteloelementit suorina HTML-tiedostossa?

Sisennysten avulla voit pitää luettelon elementit suorina. Jos sisestät jokaisen alisuljetun luettelon pidemmälle kuin sen sisältävän ylätason luettelon, voit yhdellä silmäyksellä määrittää eri luettelot ja sen sisältämät elementit.

---

13) Jos näet lehdessä verkko-osoitteen, mille verkkosivulle se osoittaa?

Jokaisella web-sivulla voi olla erillinen verkko-osoite. Suurin osa näistä osoitteista on suhteessa ylimpään verkkosivuun. Lehdissä näkyvä julkaistu verkko-osoite osoittaa yleensä tämän ylimmän sivun. Tältä ylimmän tason sivulta pääset kaikille muille verkkosivuston sivuille.

---

14) Mitä hyötyä vaihtoehtoisesta tekstistä on kuvakartoituksessa?

Kun käytät kuvakarttoja, voi helposti tulla hämmentävää ja vaikeaa määrittää, mitkä hotspotit vastaavat mitäkin linkkejä. Vaihtoehtoisen tekstin avulla voit laittaa kuvaavan tekstin jokaiseen hotspot-linkkiin.

---

15) Toimivatko vanhemmat HTML-tiedostot uudemmissa selaimissa?

Kyllä, vanhemmat HTML-tiedostot ovat HTML-standardin mukaisia. Useimmat vanhemmat tiedostot toimivat uudemmissa selaimissa, vaikka jotkin ominaisuudet eivät välttämättä toimi.

---

16) Koskeeko hyperlinkki vain tekstiä?

Ei, hyperlinkkejä voidaan käyttää sekä tekstissä että kuvissa. Tämä tarkoittaa, että voit muuntaa kuvan linkiksi, jonka avulla käyttäjät voivat linkittää toiselle sivulle, kun niitä napsautetaan. Ympäröi kuva … -tunnisteyhdistelmillä.

---

17) Jos käyttäjän käyttöjärjestelmä ei tue tarvittavaa merkkiä, miten symboli voidaan esittää?

Tapauksissa, joissa heidän käyttöjärjestelmänsä ei tue tiettyä merkkiä, on silti mahdollista näyttää kyseinen merkki näyttämällä sen sijaan kuvana.

---

18) Kuinka muutat numerotyyppiä luettelon keskellä?

The tag sisältää kaksi attribuuttia – tyypin ja arvon. Type-attribuutilla voidaan muuttaa minkä tahansa luettelokohteen numerointityyppiä. Arvo-attribuutti voi muuttaa numeroindeksiä.

---

19) Mitä tyylisivut ovat?

Tyylisivujen avulla voit luoda yhtenäisiä, kuljetettavia ja hyvin määriteltyjä tyylimalleja. Nämä mallit voidaan linkittää useille eri web-sivuille, mikä helpottaa kaikkien sivuston verkkosivujen ulkoasua ja ulkoasua.

---

20) Tilaa luettelomerkkityypit saatavilla HTML:ssä

Järjestetyissä luetteloissa voit valita käytettäväksi joitain erilaisia ​​luettelotyyppejä, mukaan lukien aakkoset ja roomalaiset numerot. Järjestämättömien luetteloiden type-attribuutiksi voidaan asettaa levy, neliö tai ympyrä.

---

21) Kuinka luot moniväristä tekstiä verkkosivulle?

Jos haluat luoda tekstiä eri väreillä, käytä … -tageja jokaiselle merkille, jolle haluat lisätä värin. Voit käyttää tätä tunnisteyhdistelmää niin monta kertaa kuin tarvitset yhden merkin tai kokonaisen sanan ympärillä.

---

22) Miksi on olemassa sekä numeerisia että nimettyjä merkkientiteettiarvoja?

Numeeriset arvot on otettu eri merkkien ASCII-arvoista, mutta niitä voi olla vaikea muistaa. Tämän vuoksi luotiin nimetyt merkkien kokonaisuudet helpottamaan verkkosivujen suunnittelijoiden käyttöä.

---

23) Kirjoita HTML-taulukon tagisekvenssi, joka tulostaa seuraavan:
50 kpl 100 500
10 kpl 5 50

Vastaus:

<table> 
<tr> 
<td>50 pcs</td> 
<td>100</td> 
<td>500</td> 
</tr> 
<tr> 
<td>10 pcs</td> 
<td>5</td> 
<td>50</td> 
</tr> 
</table>

---

24) Mitä hyötyä on useiden valintaruutujen ryhmittelystä?

Vaikka valintaruudut eivät vaikuta toisiinsa, valintaruutujen ryhmittely auttaa järjestämään ne. Valintaruutupainikkeilla voi olla nimensä, eikä niiden tarvitse kuulua ryhmään. Yhdellä verkkosivulla voi olla useita erilaisia ​​valintaruuturyhmiä.

---

25) Mitä tapahtuu, jos käytät päällekkäisiä tunnisteita?

Jos kaksi HTML-tunnisteiden sarjaa on päällekkäin, vain ensimmäinen tunniste tunnistetaan. Löydät tämän ongelman, kun teksti ei näy oikein selaimen näytöllä.

---

26) Mitä ovat sovelmat?

Sovelmat ovat pieniä ohjelmia, jotka voidaan upottaa web-sivuille suorittamaan tiettyjä toimintoja, kuten laskelmia, animaatioita ja tietojenkäsittelyä. Sovelmat kirjoitetaan Java-kielellä.

---

27) Entä jos tagien välissä ei ole tekstiä tai jos teksti on vahingossa jätetty pois? Vaikuttaako se HTML-tiedoston näyttöön?

Jos tunnisteiden välissä ei ole tekstiä, ei ole mitään muotoiltavaa. Siksi muotoilua ei tule näkyviin. Jotkut tunnisteet, erityisesti tagit, joissa ei ole sulkevaa tunnistetta, kuten -tunnisteen, älä vaadi tekstiä niiden väliin.

---

28) Onko mahdollista asettaa tiettyjä värejä taulukon reunuksille?

Voit määrittää reunavärin tyylisivuilla, mutta taulukon, joka ei käytä tyylisivuja, värit ovat samat kuin tekstin väri.

---

29) Kuinka luot linkin, joka muodostaa yhteyden toiselle verkkosivulle, kun sitä napsautetaan?

Jos haluat luoda hyperlinkkejä tai linkkejä, jotka muodostavat yhteyden toiselle verkkosivulle, käytä href-tunnistetta. Tämän yleinen muoto on: teksti
Korvaa "sivusto" todellisella sivun URL-osoitteella, johon on tarkoitus linkittää, kun tekstiä napsautetaan.

---

30) Mitä muita tapoja voidaan käyttää kuvien tasaamiseen ja tekstin rivittämiseen?

Taulukoita voidaan käyttää tekstin ja kuvien sijoittamiseen. Toinen hyödyllinen tapa kääriä tekstiä kuvan ympärille on käyttää tyylisivuja.

---

31) Voiko yksi tekstilinkki osoittaa kahdelle eri web-sivulle?

Ei. Tunniste voi hyväksyä vain yhden href-attribuutin, ja se voi osoittaa vain yhdelle verkkosivulle.

---

32) Mitä eroa on hakemisto- ja valikkoluetteloilla ja järjestämättömällä luettelolla?

Keskeinen ero on, että hakemisto- ja valikkoluettelot eivät sisällä attribuutteja luettelomerkkityylin muuttamiseen.

---

33) Voitko muuttaa luotien väriä?

Luettelomerkin väri on aina sama kuin luettelokohdan ensimmäisen merkin väri. Jos ympäröit ja ensimmäinen merkki joukolla tunnisteita, joissa on color-attribuutti, luettelomerkin väri ja ensimmäinen merkki on eri värinen kuin teksti.

---

34) Mitkä ovat tekstikentän koon rajat?

Tekstikentän oletuskoko on noin 13 merkkiä. Jos kuitenkin sisällytät koko-attribuutin, voit asettaa koon arvoksi niinkin pieneksi kuin 1. Suurin koon arvo määräytyy selaimen leveyden mukaan. Jos size-määritteen arvoksi on asetettu 0, kooksi asetetaan oletuskoko, 13 merkkiä.

---

35) Tee Tunnisteiden tulee aina olla rivin tai sarakkeen alussa?

Mikä tahansa tagi voidaan muuttaa muotoon a tag. Tämä aiheuttaa sen sisältämän tekstin -tunniste näytetään lihavoituna selaimessa. Vaikka tunnisteita käytetään pääasiassa otsikoissa, niitä ei tarvitse käyttää yksinomaan otsikoina.

---

36) Mikä on raja- ja sääntömääritteiden välinen suhde?

Solujen oletusreunat, joiden paksuus on 1 pikseliä, lisätään automaattisesti solujen väliin, jos reunamääritteen arvo on muu kuin nolla. Samoin jos border-attribuuttia ei sisällytetä, oletusarvoinen 1 pikselin raja tulee näkyviin, jos säännöt-attribuutti lisätään tag.

---

37) Mikä on teltta?

Valintateltan avulla voit lisätä vierittävää tekstiä verkkosivulle. Voit tehdä tämän asettamalla haluamasi tekstin vierimään sisään ja tunnisteet.

---

38) Kuinka luot verkkosivulle tekstiä, jonka avulla voit lähettää sähköpostin, kun sitä napsautetaan?

Jos haluat muuttaa tekstin napsautettavaksi linkiksi sähköpostin lähettämistä varten, käytä href-tunnisteen mailto-komentoa. Muoto on seuraava:

<A HREF=”mailto:youremailaddress”>text to be clicked</A>

 

---

39) ovat tagit ainoa tapa erottaa tekstiosat?

Ei -tunniste on vain yksi tapa erottaa tekstirivejä. Muut tunnisteet, kuten tag ja tunniste, myös erilliset tekstiosat.

---

40) Onko olemassa tapauksia, joissa teksti näkyy selaimen ulkopuolella?

Oletusarvoisesti teksti rivitetään niin, että se näkyy selainikkunassa. Jos teksti on kuitenkin osa taulukon solua, jolla on määritetty leveys, teksti voi ulottua selainikkunan ulkopuolelle.

---

41) Miten aktiiviset linkit eroavat normaaleista linkeistä?

Normaalien ja aktiivisten linkkien oletusväri on sininen. Jotkut selaimet tunnistavat aktiivisen linkin, kun hiiren osoitin asetetaan linkin päälle. toiset tunnistavat aktiiviset linkit, kun linkillä on painopiste. Ne, joilla ei ole hiiren osoitinta linkin päällä, katsotaan normaaliksi linkiksi.

---

42) Rajoittavatko tyylisivut uusien tyylimääritelmien määrää, jotka voidaan sisällyttää hakasulkeisiin?

Tyylisivut eivät rajoita tietyn valitsimen suluissa olevien tyylimääritelmien määrää. Jokainen uusi tyylimäärittely on kuitenkin erotettava muista puolipisteellä.

---

43) Voinko määrittää fonttipainolle murto-osia, kuten 670 tai 973?

Käyttöönotto riippuu pitkälti selaimesta, mutta standardi ei tue murto-osia. Hyväksyttävien arvojen tulee päättyä kahteen nollaan.

---

44) Mikä on hierarkia, jota noudatetaan tyylisivujen suhteen?

Jos yksi valitsin sisältää kolme eri tyylimääritelmää, varsinaista tunnistetta lähinnä oleva määritelmä on etusijalla. Sisäinen tyyli on etusijalla upotettuihin tyylisivuihin nähden, mikä on etusijalla ulkoisiin tyylisivuihin nähden.

---

45) Voidaanko useita luokkanimiä sisältäviä valitsimia ryhmitellä yhteen?

Voit määrittää useita valitsimia samalla tyylimäärityksellä erottamalla ne pilkuilla. Sama tekniikka toimii myös valitsimissa, joilla on luokkanimiä.

---

46) Mitä tapahtuu, jos avaat ulkoisen CSS tiedosto selaimessa?

Kun yrität avata ulkoisen CSS-tiedoston selaimessa, selain ei voi avata tiedostoa, koska tiedostolla on eri tunniste. Ainoa tapa käyttää ulkoista CSS-tiedostoa on viitata siihen käyttämällä -tunniste toisessa HTML-asiakirjassa.

---

47) Kuinka teet kuvan verkkosivun taustakuvaksi?

Voit tehdä tämän asettamalla koodin koodin perään tagi seuraavasti:

<body background = “image.gif”>

Korvaa image.gif kuvatiedostosi nimellä. Tämä ottaa kuvan ja tekee siitä verkkosivusi taustakuvan.

---

48) Mitä tapahtuu, jos list-style-tyyppistä ominaisuutta käytetään ei-luetteloelementissä, kuten kappaleessa?

Jos list-style-tyyppistä ominaisuutta käytetään ei-luetteloelementissä, kuten kappaleessa, ominaisuus ohitetaan, eikä se vaikuta kappaleeseen.

---

49) Milloin kehyksiä kannattaa käyttää?

Kehykset voivat tehdä sivustolla navigoinnista paljon helpompaa. Jos päälinkit sivustolle sijaitsevat kehyksessä, joka näkyy selaimen yläreunassa tai reunassa, näiden linkkien sisältö voidaan näyttää selainikkunan loppuosassa.

---

50) Mitä tapahtuu, jos rivi- tai sarakkeet-attribuutin arvojen summa ei ole 100 prosenttia?

Selain määrittää kehysten koon suhteessa arvojen kokonaissummaan. Jos cols-attribuutti on asetettu arvoon 100%, 200%, selain näyttää kaksi pystysuuntaista kehystä, joista toinen on kaksi kertaa suurempi kuin ensimmäinen.

---

51) Mitkä selaimet tukevat HTML5:tä?

Google Chromen, Apple Safarin, Mozilla Firefoxin ja Operan uusimmat versiot tukevat useimpia HTML5-ominaisuuksia.

---

52) Nimeä kaksi uutta HTML 5 -tunnistetta

ja ovat uusia tageja, jotka sisältyvät HTML5-versioon. Niitä käytetään pääasiassa Flashin, Silverlightin ja vastaavien tekniikoiden korvaamiseen multimediakohteiden toistamiseen.

---

53) Tiedätkö, mitkä kaksi semanttista tunnistetta sisältyvät HTML5-versioon?

The ja tagit ovat kaksi uutta tunnistetta, jotka sisältyvät HTML5:een. Artikkelit voivat koostua useista osioista, joissa voi olla useita artikkeleita. Artikkelitunniste edustaa täyttä sisältölohkoa, joka on osa suurempaa kokonaisuutta.

---

54) Mikä on HTML5:ssä?

Tämä tunniste edustaa osaa itsenäisestä virtaussisällöstä. Sitä käytetään enimmäkseen yhtenä yksikkönä asiakirjan päävirran viitteenä.

---

55) Mitä hyötyä Canvas-elementistä on?

Canvas-elementti auttaa rakentamaan kaavioita, kaavioita ja ohittamaan Photoshop luodaksesi 2D-kuvia ja sijoittaaksesi ne suoraan HTML5-koodiin.

---

56) Mitkä ovat uudet FORM-elementit, jotka ovat saatavilla HTML5:ssä?

Uudet Form-elementit HTML5:ssä tarjoavat paljon parempia toimintoja kuin aiemmat versiot.

Näiden toimintojen suorittamiseen annetut tunnisteet ovat:

1) – Tätä tunnistetta käytetään määrittämään luettelo syöttöohjaimista.

2) – Tämä tagi edustaa avainparien luontikenttää.

3) – Se edustaa minkä tahansa komentosarjalaskelman tulosta.

---

57) Kerro minulle kaksi HTML5-verkkotallennustilan etua

HTML5-verkkotallennustilan kaksi tärkeintä etua:

• Se voi tallentaa jopa 10 Mt dataa, mikä on varmasti enemmän kuin mitä evästeillä on.
• Web-tallennustietoja ei voi siirtää HTTP-pyynnön kanssa. Se auttaa lisäämään sovelluksen suorituskykyä.

---

58) Mitä verkkotallennustyyppejä on HTML5:ssä?

Kaksi HTML5-tallennustyyppiä ovat:

Istunnon tallennus: Se tallentaa tiedot vain nykyisestä istunnosta. Se tarkoittaa, että istuntomuistiin tallennetut tiedot tyhjenevät automaattisesti, kun selain suljetaan.

Paikallinen varasto: Paikallinen tallennustila on toinen HTML5-verkkotallennustyyppi. Paikallisessa tallennustilassa tietoja ei poisteta automaattisesti, kun nykyinen selainikkuna suljetaan.

---

59) Mikä on HTML5:n sovellusvälimuisti ja miksi sitä käytetään?

Application Cache -konsepti tarkoittaa, että verkkosovellus tallennetaan välimuistiin. Se on käytettävissä ilman Internet-yhteyttä.

Jotkut sovellusvälimuistin edut:

1. Offline-selaaminen – Verkkokäyttäjät voivat käyttää sovellusta myös ollessaan offline-tilassa.
2. Nopeus - Välimuistissa olevat resurssit latautuvat nopeammin
3. Vähennä palvelimen kuormitusta - Web-selain lataa vain päivitetyt resurssit palvelimelta.

---

60) Selitä viisi uutta syöttötyyppiä, jotka HTML5 tarjoaa lomakkeille?

Seuraavassa on HTML5:n tarjoamat tärkeät uudet tietotyypit:

1. Treffi: Sen avulla käyttäjä voi valita päivämäärän.
2. päivämäärä-aika-paikallinen: Tämän syöttötyypin avulla käyttäjä voi valita päivämäärän ja kellonajan ilman aikavyöhykettä.
3. päivämääräaika: Tämän syöttötyypin avulla käyttäjä voi valita päivämäärän ja ajan aikavyöhykkeellä.
4. kuukausi: Sen avulla käyttäjä voi valita kuukauden ja vuoden
5. email: Nämä syöttökentät sisälsivät aiemmin sähköpostiosoitteen.

Nämä haastattelukysymykset auttavat myös viva-asioissasi. Rakentaa valoisa ura UI / UX kehittäjä, ehdokkaiden on murtauduttava haastatteluun, jossa heiltä kysytään erilaisia ​​HTML5-haastattelukysymyksiä.