CSS: barva pisave, slogi, ozadje, velikost

Programiranje - to zrcalo: na začetku je bila beseda, odgovor pa sploh ni bil. In zelo hitro je bilo potrebno "spremeniti": najprej zrcalo, nato besedo ... V tem trenutku so tabele kaskadnih stilov dobre, toda zakaj je razvijalski um tako dolgo? CSS je enaka množica od začetka obdobja računalniških programov, vendar le v drugačnem pogledu. Tudi ko so matrike postale asociativne, ga revolucija ni ustvarila.

Stran spletnega mesta so označevalne oznake HTML, ki jih je mogoče dodeliti določenemu slogovskemu razredu ali identifikatorju sloga. Prvi lahko določimo enkrat in ga pripisujemo čim večkrat, kot je potrebno, druga pa pripada določenemu elementu.

Splošna logika opisa sloga

Tradicionalno je slog vstavljen v datoteko CSS, vendar jo lahko dodelite določenemu elementu v svojem atributu sloga. V dinamiki lahko ustvarite slog z uporabo JavaScripta. Posebnega pomena ni, kako opisati, na primer, CSS barvo pisave, njeno velikost, slušalke, ozadje pod njim in tako naprej. Kraj opisa sloga je pomemben v kontekstu, ponavadi dveh, idej: kasneje je opisano, bolj je prednostna in če je opisana na elementu, je absolutno pomembno. Zadnja, zapisana kot je, izrecno določa prednost.

Uporabite slog, tako da na primer nekatere barve pisave spremenijo barvo, lahko to storite kjer koli in na vsak način. Vprašanje je, kako se bo brskalnik odzval na to med razstavljanjem vseh slogov v agregatu. Koliko bo porabilo za CPU?

V idealnem primeru bi bilo treba barvo pisave navesti samo enkrat - to je klasična. Če želite pomisliti na en preprost opis še nekaj, nato pa še drugo in ... seveda, lahko. To je modno, vendar nepraktično.

Primer splošne logike

To je zelo preprosto: če določite barvo CSS za samo tri elemente, lahko dobite vsaj tri dolge težave:

# Ele1, # Ele2, # Ele3 {
POLOŽAJ: absolutno;
Levo: 20px;
Vrh: 14px;
Barva: rdeča;
}

# Ele2, # Ele3 {
Levo: 90px; // spremenite koordinat CSS vodoravno
Barva: rumena; // spremenite barvo pisave CSS
}

# Ele3 {
Vrh: 114px; // spremenite koordinat CSS navpično

Barva: zelena; // znova spremenite barvo pisave CSS

Barva ozadja: svetloba; // spremeni se barva izbire besedila CSS, vendar to ni v # Ele1 in # Ele2; Položaj je spremenjen, vendar se je že spremenil v # Ele2 in ne tako kot tukaj

}

Zdaj se moramo spomniti, da so bili vsi ti tri elementi nekje definirani, v primeru spreminjanja barvnih predstavitev lastnika mesta pa se mora razvijalec spomniti ne le o barvi, ampak tudi o levi in top pravilih, zato ne smemo pozabiti barvne spremembe izbire besedila.

Vsi razvijalci ne izpolnjujejo zahteve CSS: slog identifikatorja je samo za en element in slog razreda za številne oznake, slednji pa je mogoče označiti z oznakami kot pridevniki:

• Nastavi barvo pisave v slogu CSS v sloju groundColor;
• Določite velikost pisave - velikost razreda15;
• Nastavite pozicijski razred PlaceUp.

Seveda je uporaba identifikatorjev, še posebej, če pripadajo posameznemu elementu markupa, boljša kot ducat stilskih razredov, pobarvanih v različnih kombinacijah več kot sto strani elementov. Toda vse ima svojo lastno logiko.

Razvijalec mora upoštevati samo pravilno: če tudi CSS ponuja barvo pisave , ki jo je mogoče opisati togo, je njegovo delo prilagodljiva splošna struktura opisov.

Pričakovan rezultat uporabe splošne logike

Sodobni brskalniki se mirno nanašajo na veliko število slogovnih datotek in njihovih količin. Vendar pri oblikovanju, zlasti prek CSS, barve celotne strani, je treba vedno razmišljati o razumni zadostnosti. Niso vsa pravila stila "poceni" videti v aplikaciji. Preprost laktonski vnos: * {barva: bela;} - je vsekakor lep, vendar velja za vse elemente strani brez izjeme.

Od vseh pravil, ki jih ima CSS, je najpomembnejše:

• Slog je razred, nato pa se njegovo ime začne s ».«;
• Identifikator sloga in njegovo ime se začne s simbolom "#";
• V drugih primerih - to je ime oznake ali nekaj posebnega

Druge ideje v smislu opisovanja slogov (dedovanje, prekrivajoče se lastnosti, prednostne naloge, položaj, vrstni red itd.) Je smiselno in strogo treba uporabiti, kot je potrebno.

Brskalnik bo vedno pogrešal, kar v opisu ne razume, zato ne bo nobenih posebnih presenečenj. Če nekaj ni na pravem mestu ali pa niste mogli nastaviti barve pisave v CSS, je napaka v slogu.

Nepričakovane možnosti

Ne zlorabljajte slogov, kot so * {left: 124px; } Or

Ol ol, ol ul, ul ul, ul ol {margin-dno: 0; }
Img {border: 0; }

Čeprav je težko prisiliti razvijalca novic, da uporabi pravila CSS, kot je. Vedno pri razvoju katerega koli spletnega mesta, celo idealno preprosta CSS sintakso predstavlja nepredvidene težave. Če pa si prizadevate za ustrezno uporabo sintakse, vendar pa nanj uporabite funkcijo JavaScript, vam bodo nove nepričakovane funkcije omogočile, da se izognete enoličnemu ustvarjanju identifikatorjev za vsak element ali da sledite raznolikosti uporabe slogovnih razredov.

CSS ni le stylesheet, povezan s stranjo prek oznake povezave ali vstavljen vanj s slogovno oznako. Prav tako je priložnost, da ustvarite slog na letenju ali spremenite obstoječega.

Uporaba CSS-ja, barva pisave se lahko izvaja programsko. Poleg velikosti, položaja, alineja. Spletna stran ni cilj uporabiti znanja v CSS, HTML, PHP ali utripajoče učinke JavaScript.

Spletni vir je predvsem na voljo na določen način. Zato je CSS najbolje gledati v dinamiki skozi prizmo, kako jo lahko generirate, medtem ko je stran še vedno na strežniku (zaseda PHP, ko je obiskovalec prišel na spletno mesto, ne pa razvijalec, ko je razvijal spletno mesto), želeno slikovno datoteko Za določeno besedilo za trenutno vsebino ali ustvarite slog razreda ali ID-ja na poti v procesu strani, ko ga pregleda posamezen obiskovalec.

Statična dinamika

Ni vedno potrebno pisati zapletene kode JavaScript, da bi vsebino dinamično in njegova zasnova - ustrezna vsebina. Včasih je dovolj, da pravilno izkoristite priložnosti. Zlasti s tem, da določite barvo pisave v CSS s statičnim pravilom, lahko skrijete skrito pravilo in si ogledate drugo (vidno) pravilo.

Tu dinamika ne zahteva algoritma:

// označite gumb za prijavo na spletnem mestu
Funkcija scfWelcomeOver () {
Document.getElementById ('scDocxNamePiP') Style.visibility = 'vidno';
}

// Skrij gumb za prijavo na spletnem mestu
Funkcija scfWelcomeOut () {
Document.getElementById ('scDocxNamePiP'). Style.visibility = 'skrit';
}

CSS ponuja lastne različice dinamike: teče linije, preglednost elementov, različne različice prekrivanj, manifestacije, barvne izgine. V CSS se lahko barva pisave naredi tudi taka, da ni predpisano nobeno slogovno pravilo.

Dinamični prikaz vsebine

Če ni bilo dogme, verjetno ne bi prišlo do nobenega napredka. Z njo preprosto ni ničesar. Hypertext je pripeljal mnoge dogme na svet. Čas je, da se jim posvetimo in razvijemo spletne strani v pragmatičnem in praktičnem slogu.

Na začetku je stran (P), vsebina (K) je nameščena na njej, vse oznake strani so opisane v slogovnem listu (S). Ni novost, da na strežniku ustvarite stran P skozi PHP ali Perl in izberete K iz baze podatkov. Obstoječi slogovni list S je samodejno pritrjen. Vendar se lahko K spremeni in v večini primerov takšna sprememba bo pomenila potrebo po drugih slogih, to je v S +.

Na primer, kupec je dejal: "Spletna stran, ki opisuje življenje v Moskvi, bo videti bolje, če bodo člani novic urejeni v slogu" ZAZ-Zavtrak ", opisi nočnega vrveža v slogu" Las Vegas "in članki o znanstvenem in tehnološkem napredku v slogu" ModernTechno ". Ampak, če naredite S za te tri možnosti, potem ni nobenega zagotovila, da stranka ne bo imela ideje, da ima nabor člankov "Novice", "Prazniki", "Delo", "CSS / HTML" in bonus "Hostesa".

Bolj praktičen je drug pristop. Ne glede na kategorijo članka je v njej vedno vsebina, ki je lahko obarvana v določeni barvi. Tukaj na tem mestu je precej smiselna misel: po pridobitvi določenega K, tudi na strežniku, da oblikuje ustrezen S, in ko brskalnik zahteva P, bo dobil ustrezno vsebino v pravilnem oblikovanju.

Dinamika sloga iz JavaScripta

Minimalna, čeprav zelo učinkovita rešitev je styling neposredno v brskalniku stranke. Najprej, raztovarja strežnik - ne bo treba izgubljati časa pri oblikovanju stranskih hipertekstnih in slogovnih datotek za to.

Drugič, naravni odpadki časa v brskalniku ustvarjajo učinek, da je stran zasedena in aktivno podpira dialog z obiskovalcem: še vedno ne zaznava vsebine v razsutem stanju, zato bo želel dosledno in premišljeno izpisovanje informacij.

Tretjič, razvijalcu omogoča, da zagotovi obiskovalcu mehanizem za ustvarjanje vsebine v slogu, v katerem je primeren. Nihče drug nima tega.

Za izvedbo te zamisli je treba takoj po nalaganju strani in v procesu delovanja uporabiti mehanizem za ustvarjanje slogov elementov. Moderna spletna stran je AJAX v eni ali drugi obliki. Ni težko izvesti oblikovanja slogov neposredno v procesu oblikovanja drevesa strani. Je preprosta, dostopna in učinkovita, saj vsebina ustreza oblikovanju.

To ne nasprotuje trenutnemu trendu ločevanja predstavitve podatkov od njihove obdelave in se izvaja na podatkih, ki zapuščajo zaslon.

CSS kot aktivna komponenta

Hipertekst je prinesel veliko dobrega, a le majhen del naravnih informacij je bil uspešno formaliziran, pojavili so se orodja in izkušnje pri ustvarjanju visokokakovostnih dokumentov HTML, XML in CSS. Ni problem, da formaliziramo nove količine informacij in spremenimo, kar je bilo storjeno prej.

V zvezi s CSS se ta proces že aktivira v popolnoma drugačnem kontekstu. Vgrajena orodja v JavaScriptu, ki omogočajo leteti, da ustvarijo elemente in sloge elementov, niso pričakovali takšne priložnosti, predvsem pa so ustvarjalci PHP verjeli, da sodelujejo pri oblikovanju zgolj HTML strani.

Tako prvi kot drugi vam omogočata, da naredite sloge programa. To je nova usmeritev na področju informacijske tehnologije. Slogi so veliko bolj formalni kot HTML ali XML, pravila so zelo preprosta. Slog je vedno prisoten v informacijah, ne glede na to, kakšna je narava.

Programatorji za obdelavo podatkov se vedno ukvarjajo s precej bolj neformalnimi področji, vendar je tema CSS zelo preprosta naloga, vendar nekako ni spadala v vidik razvojnega procesa.

O dogmah na področju programiranja

Kot ledena gora dogma ne more dolgočasiti informacijskih prostorov. Zbrane izkušnje so se osredotočile ne le na standarde HTML in CSS, orodja za delo z njimi, znanje razvijalcev.

Preprosta naloga - uporabiti CSS barvo pisave - je našla svojo odlično rešitev. Pravila, sintaksa, logika in udobje so nesporni. Toda tudi, ko zares ne potrebujete veliko pisav, vam ni potrebno veliko barv za prakso in na splošno za namene virtualizacije vse nabrane "moči" HTML-ja in CSS sploh ni potrebno, pride trenutek, ko situacijsko znanje preide v tiste, ki se reproducirajo, in se prikaže Izkušnje in orodja naravnega izobraževanja iz vsebine.

Kot bo to morda ne bo povsem jasno, vendar je dejstvo, da je proces že v teku, očiten.