CSS3-haastattelukysymykset - 11 hyödyllistä opittavaa kysymystä

Sisällysluettelo:

Anonim

Johdanto CSS3-haastatteluun liittyviin kysymyksiin ja vastauksiin

Cascading Style Sheets on tyylisivun kieli, joka kuvaa merkintäkielellä kirjoitetun asiakirjan ulkoasua ja muotoilua. Se on suosittu web-suunnittelussa ja XHTML: ssä. CSS1 antoi suosituksen joulukuussa 1996. Tämä versio kuvaa CSS-kieltä sekä yksinkertaisen visuaalisen muotoilumallin kaikille HTML-tunnisteille. CSS3: sta tuli W3C-suositus vuonna 1999, joka perustuu CSS: n vanhempiin versioihin.

Esimerkki tyylinmuutoksesta voi olla

Hei maailma

Tavallisessa HTML-koodissa tagia käytetään sanojen lihavoimiseksi.

Tämä toimii hyvin. Mutta jonkin ajan kuluttua haluaisit tehdä tekstistä alleviivatun eikä lihavoidun, sitten sinun on siirryttävä jokaiseen sijaintiin ja vaihdettava tunniste tunnistettavaksi. Tämä on erittäin työläs tehtävä. Lisäksi, jos haluat muuttaa tekstin fonttia, sinun on kirjoitettava HTML muodossa

Tämä on tekstiä

Koodin yläpuolella on haluamasi muutokset tekstissä, mutta se vaatii paljon kääretageja, jotka on kirjoitettu ympärilleen, ja tekee HTML: stä myös sotkuisen.

CSS: n avulla voit tehdä mukautetun tyylin yhdestä kohdasta ja asettaa kaikki ominaisuudet, antaa sille yksilöllisen nimen ja merkitä HTML-koodisi näiden muotoiluominaisuuksien soveltamiseksi. CSS koostuu tyylisäännöistä, jotka selain tulkitsee ja soveltaa sitten asiakirjan vastaaviin osiin. Tyylisääntö koostuu

  • Valitsin : valitsin on HTML-tunniste, jolla tyyliä käytetään. Tämä voi olla mikä tahansa tunniste nimellä

    ,

    jne.

  • Ominaisuus : ominaisuus on HTML-tunnisteen ominaisuustyyppi. Kaikki HTML-määritteet muunnetaan CSS-omaisuudeksi. Tämä voi olla väri, reunus jne.
  • Arvo : arvot määritetään ominaisuuksille. Esimerkiksi väriominaisuudella voi olla arvo punainen, vihreä jne.

CSS-syntaksi voi olla seuraava

Valitsin (omaisuus: arvo)
Valitsimet voidaan määritellä monin tavoin seuraavasti

  • Tyypin valitsimet
    Oletusvalitsin
    h1 (väri: #ffff;)
  • Universal valitsin
    Universal-valitsin vastaa minkä tahansa tyyppistä nimeä.
    * (väri: #ffff;)
  • Jälkeläisen valitsin
    Oletetaan, että haluat käyttää tyyliä elementtiin vain, kun se on tietyn elementin sisällä. Esim
    ul em (väri: #ffff;)
    tyyliä käytetään elementtiin vain, kun se on sisällä
      tag.
    • Luokan valitsimet
      Tyylisäännöt voidaan määritellä elementin luokkatunnuksen perusteella. Kaikki elementit, joilla on tämä luokka, alustetaan määritellyn säännön mukaisesti.
    • ID-valitsimet
      Tyylisäännöt voidaan määritellä elementin id-määritteen perusteella.
      h1 # musta (väri: #ffff;)
      Tämä sääntö tekee vain mustan sisällön

      elementtejä.

    Voit lisätä tämän CSS-koodin, joka määrittelee uuden tyylin. Tyyli määritetään tunnisteella

    . myNewStyle (

    kirjasinperhe: Verdana, Arial, sans-sheriffi;

    kirjasinpaino: lihavoitu;

    väri: # FF000;

    )

    Tämä toimisi hyvin pienissä projekteissa. Mutta kun sinun on määritettävä tyylit monille sivuille, olisi erittäin vaikea kopioida ja liittää sama CSS-koodi jokaiselle sivulle. Siksi, kuten JavaScript, voit myös luoda CSS-tyylejä erillisessä tiedostossa ja linkittää sen sitten sivulle

    Koodin yläpuolella linkittää ulkoinen tyylitaulukko “stylesheet.css” HTML-dokumenttiin. Tämä linkkitunniste tulisi sijoittaa päätunnisteeseen. Voit kirjoittaa css-koodisi yksinkertaiseen testitiedostoon ja muuttaa sen laajennuksen .css-tiedostoksi.

    Valmistautuminen työhaastatteluun CSS3: ssa. Olen varma, että haluat tietää CSS3-haastattelun yleisimmät kysymykset ja vastaukset, jotka auttavat sinua murtamaan CSS3-haastattelun helposti. Alla on luettelo tärkeimmistä CSS3-haastattelua koskevista kysymyksistä ja vastauksista pelastustasi, joka on jaettu kahteen osaan:

    Osa 1 - CSS3-haastattelukysymykset (perus)

    Tämä ensimmäinen osa kattaa CSS3: n peruskysymykset ja vastaukset

    1.Millä monin tavoin CSS voidaan integroida verkkosivuksi?

    Vastaus:
    CSS voidaan integroida kolmeen tapaan

    • Inline: Style-ominaisuutta voidaan käyttää CSS: n soveltamiseen HTML-elementteihin.
    • Upotettu: pääelementissä voi olla tyylielementti, johon koodi voidaan sijoittaa.
    • Linkitetty / tuotu: CSS voidaan sijoittaa ulkoiseen tiedostoon ja linkittää linkielementin kautta.

    2. Mitä etuja ja haittoja ulkoisilla tyylitaulukoilla on?

    Vastaus:

    Edut:

    • Yhtä tiedostoa voidaan käyttää monille eri asiakirjoille, joilla on useita tyylejä.
    • Useilla HTML-elementeillä voi olla monia erilaisia ​​asiakirjoja, joilla voi olla luokkia.
    • Tyylien ryhmittelemiseksi yhdistelmätilanteissa voidaan käyttää menetelmiä valitsimina ja ryhmittelyinä.

    haitoista

    • Ylimääräinen lataus tarvitaan dokumenttien tuontiin, joilla on tyyliä koskevia tietoja.
    • Asiakirjan renderoimiseksi ulkoinen tyyliarkki tulisi ladata.
    • Ei käytännöllinen pienille tyylimääritelmille.

    Siirrytään seuraavaan CSS3-haastattelukysymykseen

    3. Mitkä ovat upotettujen tyylisivujen edut ja haitat?

    Vastaus:
    Tämä on CSS3: n perushaastattelukysymys, jota on usein kysytty haastattelussa. Seuraava on ansio ja haitta ovat seuraavat:

    Meriitit:

    • Yhdessä asiakirjassa voidaan luoda useita tunnistetyyppejä.
    • Tyylejä voidaan monimutkaisessa tilanteessa soveltaa valitsimella ja ryhmittelymenetelmillä.
    • Ylimääräinen lataus turhaan.

    haitoista

    • Useita asiakirjoja ei voi hallita.

    4. Mitkä ovat CSS: n edut ja rajoitukset?

    Vastaus:

    edut

    • kaistanleveys
    • Koko sivuston johdonmukaisuus.
    • Sivun muotoilu.
    • saavutettavuus
    • Sisältö erillään esityksestä.

    haitat

    • Valittavien nousu ei ole mahdollista.
    • Pystysuoran ohjauksen rajoitukset.
    • Ei ilmaisuja.
    • Ei sarakeilmoitusta.
    • Pseudo-luokka, jota ei hallita dynaamisilla ilmoituksilla.
    • Tiettyyn tekstiin kohdistuvat säännöt, tyylit eivät ole mahdollisia.

    5. Voidaanko CSS: ään lisätä useita ilmoituksia?

    Vastaus:
    Kyllä, se voidaan saavuttaa puolipisteellä;

    Osa 2 - CSS3-haastattelut (Advanced)

    Katsokaamme nyt edistyneitä CSS3-haastattelukysymyksiä.

    6. Erottaa loogiset tunnisteet fyysisistä tunnisteista?

    Vastaus:

    • Fyysisiin merkintöihin viitataan myös esittelymerkintöinä; loogisia tunnisteita ei käytetä esityksissä.
    • Fyysiset tunnisteet ovat uudempi versio, kun taas loogiset tunnisteet ovat vanhoja ja keskittyvät sisältöön.

    7. Mikä on asiayhteyden valitsin?

    Vastaus:

    Elementin erikoistapahtumien valitsemiseksi käytettyä valitsinta kutsutaan kontekstuaaliseksi valitsijaksi. Tila erottaa yksittäiset valitsimet. Vain viimeinen kuvion osa käsitellään tällaisessa valitsimessa.

    Siirrytään seuraavaan CSS3-haastattelukysymykseen

    8. Kuinka Z-indeksi toimii?

    Vastaus:
    Päällekkäisyyttä voi tapahtua, kun CSS: ää käytetään HTML-elementtien sijoittamiseen. Z-hakemisto auttaa määrittelemään päällekkäisen elementin. Se voi olla positiivinen tai negatiivinen luku, oletusarvo on nolla.

    9. Onko mahdollista tehdä luokanvalitsin tietylle elementille? Miten?

    Vastaus:
    Kyllä, voimme tehdä luokanvalitsimen tietylle elementille. Esimerkiksi

    h2.className (
    Väri: #FFFF;
    )
    Yllä olevassa esimerkissä, kun luokan nimi 'className' löytyy elementistä 'h2', käytä valkoista väriä.

    10. Kuinka voimme luoda tekstivarjo- tai ruutuvarjon CSS3: een?

    Vastaus:
    Laatikon varjo voidaan luoda
    laatikko-varjo: 5 x 5 x 2 x x # pff;
    teksti-varjo: 5xx5xx2px #ffff;

    11.Mitä uusia tekstejä lisätään CSS3: een?

    Vastaus:

    • Rivitys
    • Teksti-ylivuoto
    • Word-break

    Suositellut artikkelit

    Tämä on opas CSS3: n haastattelukysymysten ja vastausten luetteloon, jotta ehdokas voi helposti hakea nämä CSS3: n haastattelukysymykset. Täällä tässä viestissä olemme tutkineet CSS3: n suosituimpia haastattelukysymyksiä, joita usein kysytään haastatteluissa. Voit myös katsoa seuraavia artikkeleita saadaksesi lisätietoja -

    1. Perl-haastattelukysymykset ja -vastaukset
    2. 10 edistynyttä AngularJS -haastattelukysymystä
    3. Mahtavaimmat PHP-haastattelukysymykset kokeneille
    4. 12 hyödyllisintä Djangon haastattelukysymystä