Kako povezati CSS: od statike do dinamike

Statična povezava CSS stilov HTML-page je preprosta naloga. Oblikovane tradicije ponujajo tri glavne možnosti: neposredno na oznaki, v posebni slogovni oznaki in s povezovanjem zunanje css datoteke. Uporaba jezika strežnika vam omogoča, da zagotovite dinamiko teh metod, vendar z uporabo jezika brskalnika javascript odpre popolnoma različne načine.

Oznake HTML in CSS

Spletna stran je formaliziran slog predstavitve. Vsak tekstovni ali grafični element je privzeto prikazan "kot je" v brskalniku ali pa je opisan s pravili CSS in prikazan, kot ga je oblikoval oblikovalec in ga je izvedel programer. Vsako pravilo CSS je ime in vrednost. Razvoj kaskadnih listov slogov je privedel do številnih imen in vrednot. Bilo je psevdo-razredov in psevdoelementov. Uporaba CSS razredov in ID-jev je tesno prepletena z oznakami HTML. Naloga, kako povezati CSS z določeno oznako, je prejela široko paleto dovoljenih odločitev.


V bistvu so tri možnosti za povezovanje pravila CSS z želeno oznako:
  • neposredno preko oznake slog atributa;
  • s posebno oznako;
  • s povezavo zunanje datoteke slogov.
  • Vsaka netočnost ali napaka v povezavi opis in slog bo prezrta. HTML - jezik trdih konstrukcij, ki omogoča dinamiko uporabe jezika strežnika, je dovoljen le v določenih mejah. Uporaba mehanizma AJAX razširja meje možnega. Toda v vsakemv primeru reševanja naloge, kako povezati CSS-pravilo z oznako HTML, je statična: pravilo je zapisano in označuje, za kaj velja.

    Okvir za slog strani HTML

    Primer prikazuje, kako povezati zunanjo sci-index.css

    slogovno datoteko in kako to narediti s posebno oznako

    : tukaj se spremeni barva ozadja za telo telesne oznake. Kako povezati CSS pravilo neposredno z oznako dvakrat (skozi id; preko atributa style) je opisano v
    . Tukaj scWelcomeLabel identificira slog (nabor pravil) iz datoteke zunanjih slogov, atribut style pa določa samo eno pravilo: vrh - koordinata Y od zgornjega roba bloka, v katerem je ta oznaka.


    Uporaba jezika strežnika PHP
    za ustvarjanje obrazca postavlja drugo raven "trdote" na slog.
    V bistvu je naloga ustvarjanja spletne strani postopek za natančno opredelitev zaporedja oznak, ki vsebino (informacije) pravilno določajo zaradi pravil CSS. Če je stran ustvarjena s kodo PHP, potem togo strukturo oznak in njihove povezave s pravili CSS "poveča" kodo PHP. Dejstvo je, da je naloga, kako povezati CSS HTML pri uporabi PHP, dvojna stopnja trdote. Če se oblikovanje spremeni in morate spremeniti pravilo CSS, boste morali spremeniti kodo CSS /HTML in PHP.

    Dinamika preprostega pravila CSS

    Ni težko najti oznake getElementById () in ji dodeliti nov slog ali spremeniti ločeno pravilo stila. Naslednji primer prikazuje oznake glave, vsebine in celic, nato pa se njihove koordinate spremenijo. Ta logika vam omogoča pisanje funkcije scfChange indodeli dogodke - spremenite velikost okna brskalnika.
    Rezultat: Obiskovalec lahko spremeni velikost okna brskalnika in stran samodejno prilagodi položaj glave, vsebine in kleti.

    CSS Stylesheet

    HTML je tesno povezan s CSS-jem in ni težko ustvariti posebnega stila v realnem času in uporabljati nova (spremenjena) pravila. Ni potrebe, da bi rešili problem, kako povezati CSS datoteko: želeno vsebino lahko generiramo dinamično.
    Tukaj je CSS-stil dinamično oblikovan in povezan. To lahko storite večkrat. Najprej se ustvari niz znakov StyleText, ki vsebuje "literal" opis zahtevanega niza pravil CSS. Pravilo slike ozadja je prikazano z besedilom želene slike: produkcijski stroški so slika znotraj sloga, vendar za to ni potrebna zunanja datoteka te slike. Po opisu zahtevanega niza pravil v obliki niza znakov se ustvari slogovna oznaka, poda tip besedila /css in vsebina oblikovane oznake se napolni z zahtevano vsebino. Naloga, kako povezati CSS v teku tečaja, v procesu dela obiskovalcev strani, je rešena!
    Dodajanje telesa dokumenta novi oznaki s strani avtomata omogoča dostop do vseh slogov, opisanih v njem. Povežite CSS v dinamiko - je preprost, praktičen in zanesljiv.

    Sorodne publikacije