CSS: boja fonta, stilova, pozadina, veličina
Programiranje - to ogledalo: u početku je postojala neka riječ, a odgovor uopće nije bio odgovor. I vrlo brzo je bilo potrebno "promijeniti": prvo zrcalo, a zatim riječ ... U ovom trenutku tablice kaskadnih stilova su dobri, ali zašto je razvojni um tako dugo napredovao? CSS je isti niz vremena od početka ere računalnih programa, ali samo u drugoj perspektivi. Čak i kada su polja postali asocijativni, to nije dovelo do revolucije.
sadržaj
Stranica stranice oznake HTML oznaka koje se mogu dodijeliti određenom klasi stila ili ID stilu. Prvi se može definirati jednom i pripisati svemu onoliko puta koliko je potrebno, a drugi pripada određenom elementu.
Opća logika opisa stila
Tradicionalno, stil se nalazi u CSS datoteci, ali se može dodijeliti određenom elementu u svom atributu stila. Stil možete izraditi u dinamici pomoću jаvascript-a. Od posebne važnosti nije kako opisati, na primjer, kroz CSS boja font, veličinu, slušalice, pozadinu ispod nje i tako dalje. Mjesto opisa stila je u kontekstu, obično dva od ideja: kasnije je opisano, to je prioritet, a ako je opisan na elementu, to je uopće važno. Posljednji, pisani kao što je, izričito određuje prioritet.
Primijenite stil tako da, na primjer, neke boje fonta mijenjaju boju, to možete učiniti bilo gdje i u svakom slučaju. Pitanje je kako će preglednik reagirati na to prilikom rasklapanja svih stilova u skupini. Koliko će potrošiti na CPU vrijeme?
Idealno, boju fonta trebao bi biti prikazana samo jednom - to je klasična. Razmisliti o jednom jednostavnom opisu još par, a zatim još jedan i ... naravno, možete. Modno je, ali nepraktično.
Primjer opće logike
Vrlo je jednostavno: definiranjem CSS bojom za samo tri elementa, možete dobiti barem tri dugotrajna problema:
# Ele1, # Ele2, # Ele3 {
POZICIJA:
lijevo: 20px;
vrh: 14 piksela;
boja: crveno-
}
# Ele2, # Ele3 {
lijevo: 90px; // promijenite vodoravnu koordinatu CSS-a
boja: žuta- // promijenite boju slova CSS
}
# Ele3 {
vrh: 114px; // promijeni CSS koordinatu okomito
boja: zelena- // promijenite boju fonta ponovo
background-color: lightgrey- // boju odabira teksta CSS se mijenja, ali to nije u # Ele1 i # Ele2 - položaj se također mijenja, ali se već promijenio u # Ele2 i ne voli se ovdje
}
Sada imamo na umu da sva ta tri elementa definirana negdje, au slučaju promjene boja prikaza vlasnika stranice, programer će imati na umu ne samo o boji, ali io lijevoj pravilima i vrhu, pa čak i promijeniti vrhunac boja teksta ne smije se zaboraviti.
Nisu svi razvojni inženjeri poštuju CSS zahtjev: stil identifikatora je samo za jedan element i stil klase za mnoge oznake, a potonji se mogu dodati u oznake kao pridjevi:
- postavite boju fonta u CSS-style groundColor klase;
- odredite veličinu fonta - veličinu klase15;
- Postavite položaj PlaceUp.
Naravno, korištenje identifikatora, pogotovo kada oni pripadaju istom elementu oznake, prvih deset stil klase, oslikane u raznim kombinacijama stotina elemente stranice. Ali sve ima svoju objektivnu logiku.
Razvojni programer treba pravilno uzeti u obzir: čak i ako je boja fonta HTML, CSS nudi da kruto opiše, fleksibilnost opće strukture opisa je njegov rad.
Očekivani rezultat primjene opće logike
Moderni preglednici mirno se odnose na veliki broj stilskih datoteka i njihovih svezaka. Međutim, pri oblikovanju, posebice CSS-om, bojom cijele stranice, uvijek treba misliti o razumnoj dovoljnosti. Nisu svi stilski pravila "jeftini" izgledaju u primjeni. Jednostavan laconski zapis: * {color: white-} - svakako je lijep, ali se odnosi na sve elemente stranice bez iznimke.
Od svih pravila koja ima CSS, najvažnije:
- stil je klasa, a njegovo ime počinje s ".";
- stil - identifikator i njegovo ime počinje simbolom "#";
- u drugim slučajevima - to je naziv oznake ili nešto posebno
Druge ideje u smislu opisivanja stilova (nasljeđivanje, preklapajuća svojstva, prioriteti, položaj, red, itd.) Trebaju se primjenjivati razumno i strogo prema potrebi.
U pregledniku će uvijek propustiti da ne razumije u opisu, tako da neće biti nikakvih posebnih iznenađenja. Ako nešto nije bilo na pravom mjestu ili niste mogli postaviti boju fonta u CSS-u, pogreška je u stilu.
Neočekivane mogućnosti
Ne biste trebali zloupotrijebiti stilove poput * {left: 124px; } ili
ol ol, ul, ul ul, ulol {margin-bottom: 0-}
img {border: 0-}
Iako je teško nagovoriti čak i razvojnog programera da koristi CSS pravila kakva jest. Uvijek u razvoju bilo koje stranice, čak i idealno jednostavna sintaksa CSS-a predstavlja nepredviđene probleme. Međutim, ako izravna napori za pravilnu uporabu sintaksi, ali se primjenjuju funkcionalnost jаvascript je nove i neočekivane prilike će izbjeći monotoni stvoriti identifikatore za svaki element, ili pratiti korištenje raznih stilova i klase.
CSS nije samo stilski obrazac povezan na stranicu putem oznake veze ili umetnut u nju putem oznake stila. To je također prilika za stvaranje stila u letu ili promjenu postojećeg.
Primjenom CSS, boju fonta može se izvršiti programski. Kao i veličina, položaj, uvlake. Web mjesto nije cilj primijeniti znanje u CSS, HTML, PHP ili treperi jаvascript učinke.
Web resurs je prvenstveno informacije koje se nude na određeni način. Zato CSS najbolje se vidi u dinamici kroz objektiv kako je moguće da se formira, a stranica je još uvijek na poslužitelju (nije dostupna PHP u vrijeme kada je posjetitelj došao, a ne programer u vrijeme kada je bio u razvoju stranice), željeni stylesheet pod određenim tekstom, u stvarnom sadržaju ili kreirajte klase ili stil ID-a u hodu u procesu stranice kada ga pregleda određeni posjetitelj.
Statička dinamika
Nije uvijek potrebno napisati složeni jаvascript kôd kako bi sadržaj bio dinamičan, a njegov dizajn - odgovarajući sadržaj. Ponekad je dovoljno pravilno iskoristiti dostupne mogućnosti. Konkretno, definirajući boju slova CSS-om kao statično pravilo u početku, možete sakriti ovo pravilo (skriveno) i vizualizirati drugo (vidljivo) pravilo.
Ovdje dinamika ne zahtijeva algoritam:
// označite gumb za prijavu na web mjestu
funkcija scfWelcomeOver () {
document.getElementById (`scDocxNamePiP`) style.visibility = `visible`-
}
// sakrij gumb za prijavu na web mjestu
funkcija scfWelcomeOut () {
document.getElementById (`scDocxNamePiP`) style.visibility = `hidden`-
}
CSS nudi svoje vlastite varijante dinamike: trčanje linije, transparentnost elemenata, razne varijante slojeva, manifestacija, boja blijedi. U CSS, boju fonta može se napraviti čak i tako da se ne daju pravila stila.
Prikaz dinamičkog sadržaja
Ako ne postoje dogme, vjerojatno ne bi bilo nikakvog napretka. Jednostavno se ništa ne može boriti. Hypertext donio mnoge dogme na svijet. Vrijeme je da ih obratimo pa razvijamo web stranice u pragmatičnom i praktičnom stilu.
U početku se nalazi stranica (P), sadržaj (K) je postavljen na njega, sve su oznake stranice opisane u listi stila (S). Nije novo kreirati P-stranicu putem PHP ili Perl na poslužitelju, odabirom K iz baze podataka. Postojeći stilski list S bit će automatski priključen. Međutim, K se može mijenjati, a u većini će slučajeva takva promjena značiti potrebu za drugim stilovima, to jest u S +.
Na primjer, kupac je rekao: „Na stranicama opisuje život Moskvi će izgledati bolje ako se novinskih članaka uređena u stilu” ZaZavtrakom „opisuje noć komešanje u stilu” Las Vegas ‘i članaka o znanstvenom i tehnološkom napretku u stilu’ ModernTehno ` ". No, ako ćemo napraviti S na tri od tih opcija, ne postoji jamstvo da kupac neće imati pojma da imaju niz članaka „Novosti”, „Holiday”, „rad», «CSS / HTML» Bonus ‘HozyaykeNaZametku’.
Još je praktičniji drugi pristup. Bez obzira na kategoriju članka, uvijek postoji sadržaj koji se može obojiti u određenoj boji. Ovdje na ovom mjestu, sasvim je razumna ideja: nakon dobivanja određene K, na poslužitelju da se formira odgovarajući S, a kada preglednik traži P, dobit će potrebni sadržaj u pravilnom dizajnu.
Dinamika stila iz jаvascript-a
Minimalna, iako vrlo učinkovita, rješenje je stiliziranje izravno u klijentovom pregledniku. Prvo, on istovaruje poslužitelj - neće biti potrebno trošiti vrijeme na formiranje hipertekstualnih stranica i stilskih datoteka za to.
Drugo, prirodno gubljenje vremena unutar pregledniku moći ćete stvoriti efekt da se stranica zauzima poslovanja i aktivno podržava dijalog s posjetitelja: on i dalje ne vidi sadržaj u rasutom stanju, dakle, on bi kao dosljedan i promišljena informacija izlaz.
Treće, dopušta razvojnom programeru da pruži mehanizam posjetitelju za izradu sadržaja u stilu u kojem je prikladan. Nitko drugi nema ovo.
Da bi se ova ideja implementirala, potrebno je implementirati mehanizam za stvaranje stilova elementa neposredno nakon učitavanja stranice i procesa njegovog funkcioniranja. Moderna stranica je AJAX u jednoj ili drugoj varijanti. Nije teško izvršiti oblikovanje stilova izravno u procesu oblikovanja stabla stranica. Jednostavno, pristupačno i učinkovito, jer sadržaj ide uz njegov dizajn.
To ne proturječi trenutnom trendu odvajanja prezentacije podataka od njihove obrade i obavlja se na podatcima koji odlaze na mapiranje.
CSS kao aktivnu komponentu
Hypertext donio puno dobrih, ali samo mali dio prirodnih informacija uspješno formalizirano, alati i iskustvo stvaranja visokokvalitetnih HTML, XML, CSS dokumenata pojavio. Nije problem formalizirati nove količine informacija i promijeniti ono što je učinjeno prije.
Što se tiče CSS-a, ovaj se proces već aktivira u potpuno drugačijem kontekstu. Ugrađeni alati u jаvascriptu, omogućujući „u letu” stvoriti elemente i stilove elemenata nije predvidjeti takvu mogućnost, a kreatori PHP, posebice, vjeruje da se bave stvaranjem samo HTML stranice.
I prvi i drugi dopuštaju stilove programiranja. Ovo je novi smjer u području informacijske tehnologije. Stilovi su puno formalniji od HTML ili XML, pravila su vrlo jednostavna. Stil je uvijek prisutan u informacijama, bez obzira na prirodu.
Registracija baze podataka programeri su sudjelovali uvijek u mnogo više službenih sektora, ali CSS Tema - vrlo jednostavan zadatak, ali nekako nisu dobili u vidnom polju u procesu razvoja.
O dogmama u području programiranja
Poput ledenog brijega, dogma ne može dugo plati informacijske prostore. Akumulirano iskustvo bilo je usredotočiti ne samo u HTML i CSS standarde, alate za rad s njima, znanje programera.
Jednostavan zadatak - kako bi crta fontova korištenjem CSS-a - našao je svoje izvrsno rješenje. Pravila, sintaksa, logika i udobnost su neupitni. No, čak i kad je pismo zapravo nemaju mnogo boja za praksu, previše nije potrebno, a zapravo radi realnosti virtualizacije ne trebaju sve nakupljene „sile» HTML i CSS, dolazi vrijeme kad je situacijska znanje ići na reproducirati i prikazuje iskustvo i alate prirodnog stila obrazovanja iz sadržaja.
Kako hoće, možda nije sasvim jasno, ali je očigledna činjenica da je proces već u tijeku.
- Kako povezati CSS fontove: Uputa
- CSS-selektor i njegova uloga u oblikovanju HTML dokumenata
- Korištenje CSS imovine `display: none`
- Struktura HTML dokumenta: glavne oznake, primjer
- CSS okvir: Impromptu i učinak
- jаvascript: typeof - potreba ili nove značajke
- jаvascript: primjeri primjene
- HTML oznake: izgled, programiranje, dizajn
- CSS: zadržite pokazivač miša. Izvorni učinci lebdenja
- jаvascript Array za pohranu neograničenog broja varijabli
- CSS font-weight svojstvo: kako postaviti zasićenje fontova
- HTML atributi: prikazi i aplikacije. HTML-vodič
- Primjer HTML stranice i osnove izrade
- Slušalice s fontom, veličina i osnovni parametri
- Upotreba DOM elemenata putem jаvascript getElementById
- Koji programski jezik odabrati početnik na studij
- Upotreba alata za jаvascript ()
- Kako povezati CSS na HTML: statičnost i dinamiku web stranice
- Sintaksa jаvascript parseInt: primjeri upotrebe
- Upotreba alata za jаvascript ()
- Sintaksa jаvascript parseInt: primjeri upotrebe