CSS nuppu. Kasu. Styles. esteetika

Ilmselt keegi sait ei ole ilma referentsiaalse teiste nuppude lehel. Igaüks tahab tuua see oma tähelepanu saidi ja samal ajal kasutada erinevaid vahendeid. Web Design seas kuuluvad disain nupud, mis erinevad vastavalt erinevatele parameetritele - nii suuruse ja kujuga ning nende mõju ja nii edasi.

CSS nupud on kõige mugavam. Praegu saavad nad täielikult muuta stiili. Ja muidugi, see annab täiendavaid võimalusi Saidi kujundus tervikuna.

For starterid, et vältida segadust ja arusaamatusi, on vaja mõista, mõned mõisted.

CSS, mis on

CSS, mis tähendab tõlkes "kaskaadlaadistiku", on täna üks peamisi tehnoloogiaid internetis. Ilma selle keel on tõenäoliselt maksma vähemalt ühes kohas.

CSS-kood - juhend brauserid, mis sisaldavad teavet, näiteks kuva elemendid lehel ja kui seda teha.

Lihtne salvestada neid juhiseid eraldi faili laiendiga .css. Teiselt poolt, neid saab panna alguses html-dokumenti.

Button kohapeal. Mis see on

Nuppu või graafilise navigatsiooni saidi peaks meelitada tähelepanu külastaja näha, et ta oli peidus vajalikku teavet ja lisaks sellele tahaks klõpsake. Kui see on piisavalt ere ja silmapaistev, siis saada märganud. See nupp võib meelitada külastajaid, näiteks kommenteerida kohapeal või saata taotlus tellida uudiskirja huvitav, ja muidugi, lihtsalt üle taotletud kasutaja osa saidile.

Nupud on staatiline, animeeritud, dünaamiline, heli ja ilma selleta.

Neid saab spetsiaalselt loodud, näiteks Photoshop, ja laadige pilt saidile, ja saab lihtsalt ja kiiresti tulla neid CSS.

CSS nuppe

Tee neid nuppe väga lihtne. Suur eelis on nende kasutamine, et nad igal ajal, vaid paar sekundit, saate muuta tundmatuseni.

Nagu me teame, on kolm põhipunkti:

• puhata, kui ei tee midagi teha, lihtsalt lugemas leht;
• viib kursori hover üle;
• ja aktiveerida klõpsates.

Täielik nupud täpselt kuvatud brauserites nagu Firefox, Safari, Opera, Chrome. Samal ajal Internet Explorer 9, nuppu ei kuvata täielikult. Näiteks ümber nurkades, teksti vari ja insult nupu ümber ei ole nähtav siin tingitud asjaolust, et need omadused ei toeta seda brauserit. Kuid üldiselt, CSS-nupud saidi näeb hea selles versioonis brauseris. Internet Explorer 8 ja muid versioone alla kaheksanda juures nuppu ei ole nähtav maht, kuid samal ajal säilitada välimus kalded.

Kui me võrdleme nuppu kujul pilte ja CSS nuppu, vahe on ruumi serveris on täiesti asjakohatu. Aga CSS nupp arvu vähendada serveri taotlused, kuid see on selge eelis võrreldes nuppu pildina.

Tuleb välja, et isegi kui toetust mõned CSS omadused Internet Explorer ja ei, neid nuppe ikka otsida rohkem võitnud kui lihtne pilte, sest ainus asi, mis kaotab kasutajate Internet Explorerit, nii et seda näha esteetika kaasaegse tehnoloogia veebis -Kavandamine. Aga see on täiesti ebaoluline viga.

Iga positsiooni arvestades tema enda stiili. Need stiilid on kirjutatud spetsiaalse faili .css vahel või pea silte väga lehekülg.

Aseta nuppu veebilehel

Märgendite vahele kirjutatud kood:

kus

id = "Button2" siin on nimi määratud nuppu,

href = http: // saidi / artikkel / 175988 /% E2% 80% 9D% D0% 93% D0% 98% D0% 9F% D0% 95% D0% A0% D0% A1% D0% A1% D0% AB % D0% 9B% D0% 9A% D0% 90% E2% 80% 9D on toodud otseühendus soovitud dokumendi

Tekst - trükitud teksti kuvatakse nupp.

Styles nupud

1. CSS Style nuppu registreeritakse eraldi dokumendis või lehe enda:

2. Esimene kirjalik CSS nuppe, kui nad on ülejäänud:

3. Lisaks parameetrid registreeritakse, mis vastab nuppu, kui kursor soovitada seda. Kui sellisel juhul ainult muudab värvi ja varjundiga ja stiili, kõik jääb samaks, välja arvatud värvi ja varjundiga:

4. Ja viimane võimalus on positsiooni vajutamisel kursor ta. Sageli sellistel juhtudel vaid väike muudatus, nagu värv, nagu käesoleval juhul:

CSS - ilus nupud

Et luua gradient, mida saab kasutada nuppe. See on kõige parem esimene tõmmake nupp igal pilt toimetaja, nagu Photoshop, nii et sa tead täpselt, mida see juhtub lõpuks. Kui kasutate Photoshop, siis esialgu on juba mõned kalded, kuid lisaks saate alla laadida rohkem, liiki, mis soovib saada kohapeal.

Testide CSS-kood ja muutuvate erinevaid parameetreid, siis on võimalik muuta CSS ilus nupud ning valiku, et saavutada soovitud tulemus.

Need parameetrid on:

- teksti värvi nupule;

- suurus tekst ja nupud;

- värvigradientide nupud;

- nupud nurgad raadiusega;

- ja värvi tema insult.

Rangelt võttes võid, kartmata, et katsetada ja valida parim valik. Vaatamata väikese arvu parameetreid, saate luua väga mitmekesine oma stiili nupud.