nemuchtorstont.ru

Voeg `n agtergrond prent by HTML

As jy `n prentjie by `n webblad wil voeg, hoef jy net HTML. As jy `n prent as agtergrond vir `n webblad wil gebruik, benodig jy beide HTML en CSS. HTML staan ​​vir Hypertext Markup Language en is kode wat die leser vertel wat om op `n webblad te wys. CSS staan ​​vir Cascading Style Sheets en word gebruik vir die voorkoms en uitleg van `n webblad. Jy benodig `n agtergrond prent as jy dit vir jou webblad wil gebruik.

stappe

Deel 1
Versamel jou lêers

Prent getiteld 2627945 1 1
1
Skep `n lêer vir die HTML-lêer en die agtergrond prent. Skep `n gids op u rekenaar wat u later weer maklik kan vind.
  • U kan die gids enige naam gee wat u wil, maar as u met HTML werk, is dit beter om lêers en dopgehou kort name wat uit een woord bestaan, te gee.
  • Prent getiteld 2627945 2 1
    2
    Plaas die agtergrond prent in die gids met HTML kode. Plaas die prentjie wat u as agtergrond in die HTML-kodemap wil gebruik.
  • Eenvoudige beelde met `n onopvallende, herhalende patroon word die beste as agtergrond beelde gebruik, sodat jy die teks op die prent kan lees.
  • As jy nie `n prent het nie, kan jy iewers `n gratis agtergrond aflaai. Plaas die prent in die HTML-kodemap wat jy geskep het.
  • Prent getiteld 2627945 3 1
    3
    Skep `n HTML-lêer. Maak `n teksredakteur oop en skep `n nuwe lêer. Stoor die lêer as index.html.
  • U kan enige teksredakteur gebruik, selfs die teksredigeerders van Windows (Notepad) en Mac OS X (TextEdit).
  • As u `n teksredigeerder spesifiek vir kodering in HTML wil gebruik, kliek hier Atom, `n teksredigeerder vir Windows, Mac OS X en Linux af te laai.
  • As jy TextEdit gebruik, klik op die kieslysformaat en maak dan gewone teks voor jy kodering in HTML begin. Hierdie instelling verseker dat die HTML-lêer korrek laai in die webblaaier.
  • Woordverwerkers soos Microsoft Word is nie geskik vir kodering in HTML nie omdat hulle onsigbare karakters en formatering voeg sodat die HTML-lêer nie korrek vertoon word in `n webblaaier nie.

    • Deel 2
    Die HTML-lêer skryf

    1
    Kopieer en plak die standaard HTML-kode. Kies en kopieer die HTML-kode hieronder en plak dit in jou geopende index.html-lêer.
    Titel van bladsy
  • 2
    Voeg die URL van die agtergrond prent by. Soek die reël in die index.html-lêer agtergrond-beeld: url (" ") -. Plaas die wyser tussen die hakies en tik dan die lêernaam van die agtergrond prent. Maak seker dat jy die uitbreiding van die agtergrond prentjie insluit.
    Wanneer jy klaar is, moet dit so lyk:
    agtergrond-beeld: url ("background.jpg") -
    As u `n lêernaam gebruik sonder `n pad of URL, sal die webblaaier in die gids van die webblad soek na die prent met daardie naam. As die lêer in `n ander gids op u stelsel is, moet u die volledige pad na die lêer byvoeg.
  • 3
    Stoor die HTML-lêer.

    • Deel 3
    Bekyk die HTML-lêer

    Prent getiteld 2627945 7 1
    1
    Open die HTML-lêer in `n webblaaier. Regskliek op die index.html en open dit dan in die webblaaier van u keuse.
    • As jou blaaier oopmaak en jy nie die prent sien nie, maak seker dat die lêernaam van die prent korrek gespel is in die indeks.html-kode.
    • Wanneer die blaaier oopmaak en jy HTML-kode sien in plaas van die agtergrond prent, het jy die indeks.html-lêer gestoor as `n ryk teks dokument. Probeer om die HTML-lêer in `n ander teksredigeerder te wysig.
  • Prent getiteld 2627945 8 1
    2
    Wysig die HTML-lêer. In die teksredigeerder plaas jy die wyser tussen die etikette en tik Hallo wêreld!. Herlaai die blaaiervenster om die teks bo-op die agtergrondafbeelding te sien.

    • Deel 4
    Die HTML-kode verduidelik

    Prent getiteld 2627945 9 1
    1
    HTML en CSS tags. HTML kode bestaan ​​uit oop en sluit etikette. die-merker is die oop liggaamsmerk, en is die liggame tag. Elke oop tag op `n HTML-bladsy het ook `n noue tag nodig om die bladsy korrek te vertoon.
  • Prent getiteld 2627945 10 1
    2
    Die DOCTYPE-tag. Elke HTML-bladsy moet met een begin . Dit maak die webblaaier duidelik dat dit `n HTML-lêer is.


  • Prent getiteld 2627945 11 1
    3
    Wysig die HTML-lêer. In die teksredigeerder plaas jy die wyser tussen die-merkers en tik daar in "Hallo wêreld! Herlaai die blaaiervenster om die teks bo-op die agtergrondafbeelding te sien.
  • Prent getiteld 2627945 12 1
    4
    HTML en CSS tags. HTML kode bestaan ​​uit oop en sluit etikette. die -merker is die oop liggaamsmerk, en is die liggame tag. Elke oop tag op `n HTML-bladsy het ook `n noue tag nodig om die bladsy korrek te vertoon.
  • Prent getiteld 2627945 13 1
    5
    Die titel tag. die -merker is teks wat in die titelbalk van jou blaaier verskyn, langs die teks wat in `n blaaier-oortjie verskyn.
  • Prent getiteld 2627945 14 1
    6
    Die style-tag. die
  • Prent getiteld 2627945 15 1
    7
    Die lyfmerk. Enige teks wat tussen is -Merkers sal as gewone teks verskyn, tensy dit HTML- of CSS-kode is.
  • Prent getiteld 2627945 16 1
    8
    Wysig die HTML-lêer. In die teksredigeerder plaas jy die wyser tussen die -merkers en tik daar in "Hallo wêreld!". Herlaai die blaaiervenster om die teks bo-op die agtergrondafbeelding te sien.

    • Deel 5
    Die CSS-kode verduidelik

    1
    Verstaan ​​die CSS-kode. In jou indeks.HTML kode, CSS kode vertel tussen die
  • 2
    Bekyk die CSS-kode.
    liggaam (agtergrond-beeld: url ("background.jpg") -)
  • 3
    Van watter dele bestaan ​​CSS-kode. CSS-style bestaan ​​uit twee dele, die selector en die verklaring.
    In die voorbeeld is body die selector en
    agtergrond-beeld: url ("background.jpg") is die verklaring.
    `N Selector kan enige HTML-tag wees.
    Verklarings is altyd tussen hakies ().
  • 4
    Wat is `n CSS-verklaring. Die CSS-verklaring bestaan ​​uit twee dele, die eiendom en die waarde. Tussen die hakies,
    background-image is die (eiendom) en eiendom url ("background.jpg") is die waarde (waarde).
    Die eiendom dui aan wat in `n styl gegooi word, en die waarde dui aan in watter mate `n styl op daardie eiendom toegepas word.
    Die eiendom en die waarde word altyd geskei deur `n kolon.
    CSS-verklarings eindig altyd met `n semikolon.
    • Deel op sosiale netwerke:

    Verwante