Računalniki, Programska oprema
CSS: tabel. primeri registracije
Izdelava mize z CSS - v lekcijo zanimivo in odgovorno. Pristop k temu poslu morali kompetentno, z znanjem vseh možnih stilov. Poleg tega, da je treba imeti občutek za lepoto, da ne bi prestrašili off svojo ustvarjalnost obiskovalcev.
Tabele lahko preoblikujejo skoraj vse. Lep dizajn vključuje uporabo meje CSS mize oblikovanja, namizni ozadju, mobilni ozadja, vrzel med njimi in še več. Razmislite najbolj osnovni.
tabela meja
CSS oblikovanje slog tabele vedno vključuje igro z mejo (frame). Vse privzete tabele niso obrisi okvir. To pomeni, da je enak 0 pik. Vendar se to lahko popravi z meje lastnine.
Določite lahko zunanji okvir za celotno tabelo:
tabela {meja: 3PX popolnoma črna; }
Zahvaljujoč tej vrstici na vseh tabel na spletni strani, ki uporablja ta slog je črn okvir. Upoštevajte, da samo meja na robovih, vendar ne v tabeli. Za celičnih linijah in okvirja ni drugače določeno.
st, TD {meja: 3PX popolnoma črna;}
Debelina in barva, lahko določite koli. Imejte v mislih, da so meje ni podvojila, ko Spajanje celic.
Beseda označuje trdno stalno registracijo. Določite lahko druge vrednote.
se najpogosteje uporablja trden okvir, kot je videti bolj privlačna in ne odvrniti pozornost od glavne vsebine spletne strani.
meja premoženje se lahko določi tudi na krovu. Meja je mogoče nastaviti samo za vrh, spodaj, levo ali desno stran. Ker v nekaterih primerih ni izvedljiva možnost z okvirjem za celotno tabelo naenkrat.
miza {meja polji: 1px trdno snov rdeče; }
Tako lahko nastavite okvir za vrh le tabele. Podobno kot vse druge stranke, namesto da bi samo vrh pisati: desno, levo ali spodaj.
tabela header
Tabela glava se lahko določi z uporabo oznake
Ta naslov je prikazan na enak način, kot je standard v knjigah (kot "tabele 1").
Določite lahko lokacijo naslova in premoženja stranjo napise (zgoraj ali spodaj). Poravnava levo ali desno, se določi z lastnino text-align.
mize v ozadju
Ozadje tabele je lahko katero koli barvo ali vzorec. Barva določa lastnine ozadja-barvo. Imena lastnosti v celoti skladna s uporabo v govoru. Lajša shranjevanje večkrat.
Barva se lahko določi kot ime, in različne kodiranja. Poleg tega lahko določite naslednje:
- Transparent - pregledna.
- Podedovali - barva je isti kot matičnega elementa.
- Začetno - privzeto.
Možnost preglednost se lahko uporabi v primerih, ko so vse tabele v besedilu v datoteki CSS, ki v eni barvi, vendar v tem primeru ni potrebna.
Poleg tega lahko v ozadju je slika. Če želite to narediti, v slogu predpisano ozadje, slike lastnine. Pot je takole:
url ( "URL")
Pot do datoteke je lahko relativna ali absolutna.
Bolj zapletena polnila je mogoče storiti z naklonom:
- linearni gradient ();
- radialni gradient ();
- ponavljanje-linearni gradient () in ponavljanje-radialni gradient () - gradient ponovi.
ozadje celic
Poleg tega, da je ozadje na splošno, lahko določite črtasto ozadje v stolpcih ali vrsticah. Za registracijo premoženja se uporablja zelo pogosto, saj je vizualna ločitev prog lažje branje podatkov.
Poleg menjavanja, pa lahko določite število posameznega stolpca ali vrstice. Na primer, kot je ta:
- TR: n-otrok (še) {...} - določite prepleteno;
- TR: n-otrok (1) {...} - navedbo lastnosti posameznega vrsti;
- TD: n-otrok (tudi) {...} - navedbo izmenični kolon;
- TD: n-otrok (1) {...} - navedbo lastnosti posameznega stolpca.
Poleg tega se lahko določi zaporedje in številke - prvi (td: prvi otrok) ali zadnja (td: v zadnjem otrok).
Razlika med celicami
V CSS, tabel vam omogoča, da odstranite presledke med celicami. Privzeto so. Na primer, če nastavite na okvir v tabeli brez nastavitev razdalje med meja, bo tukaj ta rezultat.
Strinjam se, da izgleda ni zelo lepo in ni primeren za branje. Uporabniki bodo imeli valovanje v očeh zaradi tega. Odstrani te vrzeli lahko s pisanjem le takšno črto v slogu tabele:
border-collapse: collapse
Ampak to se zgodi tudi, da je razdalja, nasprotno, bi bilo treba povečati. Poleg tega se lahko velikost vrzeli navesti med stebri in med vrsticami. Kar pomeni, da vrednost (namesto kolaps):
border-collapse: ločena
Vendar bo tak ukrep pomeni, da je treba ločiti celice. Ker je bil njihov delež, navedeno dodatno nepremičnine:
mejnih razmik: 20px.
Če želite določiti drugačno razdaljo med vrsticah in stolpcih, to pomeni dve stvari:
mejnih razmik: 10px20px.
Razlika v brskalnikih
Imejte v mislih, da je oblikovanje tabele v CSS lahko videti drugače, odvisno od brskalnika. Še posebej hudo je v primeru s starejšimi različicami, da se inovacije v CSS ni podprta.
Zgoraj je primer debelin ogrodja do digitalnih vrednosti.
Za ta primer, debelina okvirjev za konstant.
slogov obrobe tudi zelo razlikujejo.
Zato je razvoj vedno videti rezultat v različnih brskalnikih.
V CSS oblikovanje tabel priporočljivo preveriti vrsto brskalnika. Še posebej velik problem včasih za uporabnike s starejšimi različicami Internet Explorerja.
Zelo napredno razvijalci lahko, odvisno od brskalnika povezati povsem drugačne CSS datoteke. In nekdo naredi pregled v vsaki ali kak poseben stil (razred).
Večina težav izhaja iz sence.
CSS: Tabela Format Primeri
Dajemo nekaj primerov različnih tabel. Zgornja slika prikazuje uporabo nagiba in se igral z barvo ozadja in meje.
Veliko bo zanimiv primer čudovite lično oblikovano tako, da ne bo zmanjšal uporabnikom oči. Ta izvedba je primerna v skoraj vseh razmerah.
Robovi se lahko izvede zaokrožena. Izgleda zelo lepo.
zaključek
Kot lahko vidite, za izgled tabel v CSS obstaja veliko orodij. Vsak parameter je tudi ogromno možnosti vrednosti. Če jo uporabiti vse naenkrat, lahko ustvarite mojstrovine. Še posebej, če vam prilagodljivo zasnovo za vse brskalnike.
Glavna stvar pri oblikovanju - ne pretiravajte z učinki. Vse, kar bi bilo treba storiti v zmernih količinah. Sprva postavitev radi eksperimentirate in takoj uporabiti vse svoje znanje. Kot rezultat tabeli so prenasičen lastnosti. Poskusi, da bi se izognili teh napak.
Poleg tega lahko nekateri parametri motijo med seboj. Na primer, ni treba določiti barvo ozadja tabele, če pa je še vedno nastavite sliko za ozadje, ki bo prekrivala določeno barvo.
Similar articles
Trending Now