Buttuna CSS. Benefiċċji. Stili. estetika

Probabbilment ebda sit wieħed mhuwiex mingħajr referenzjali tagħha li buttuni oħrajn paġna. Kulħadd jixtieq li jġibu għall-attenzjoni tiegħek is-sit, u fl-istess ħin jużaw varjetà ta 'mezzi. Fil-web disinn fosthom jinkludu l-iddisinjar tal-buttuni, li jvarjaw skond parametri differenti - kemm fid-daqs u l-għamla, u l-effetti u l-bqija.

buttuni CSS huma l-aktar konvenjenti. Għall-mument li jistgħu kompletament jibdlu l-istil. U, naturalment, hija tagħti opportunitajiet addizzjonali għad-disinn tas-sit fit-totalità tagħha.

Għall starters, biex tiġi evitata konfużjoni u fehim ħażin, huwa meħtieġ li wieħed jifhem xi kunċetti.

CSS, li hija

CSS, li jfisser fi traduzzjoni "Cascading Style Sheets", llum huwa wieħed mit-teknoloġiji ewlenin fuq l-Internet. Mingħajr din il-lingwa huwa probabbli li jiswew mill-inqas sit wieħed.

CSS-kodiċi - gwida għall-browsers li fihom informazzjoni bħal elementi wiri fuq il-paġna u meta jekk jagħmlu dan.

Faċli biex jaħżnu dawn l-istruzzjonijiet fil-fajl separat bis-.css estensjoni. Min-naħa l-oħra, dawn jistgħu jitqiegħdu fil-bidu tal--dokument html.

Buttuna fuq is-sit. Dak li hu

Buttuna, jew grafika għan-navigazzjoni tas-sit għandhom jiġbdu l-attenzjoni tal-viżitatur biex tara li hija kienet jaħbu l-informazzjoni meħtieġa, u barra minn hekk, ikun tixtieq li ikklikkja. Meta huwa qawwi u suffiċjentament prominenti, se tikseb innotata. Din il-buttuna jista entice viżitaturi, per eżempju, jħallu l-kummenti fuq is-sit, jew jibagħtu talba lill tabbona għall-bullettin interessanti, u, naturalment, sempliċiment tittrasferixxi l-sezzjoni utent talab tas-sit.

Buttuni huma statiċi, animati, dinamika, ħoss u mingħajrha.

Dawn jistgħu jiġu maħluqa apposta, per eżempju, fil Photoshop, u upload immaġini għall-sit, u tista 'tkun faċilment u malajr toħroġ magħhom fil-CSS.

buttuni CSS

Jagħmlu dawn il-buttuni faċli ħafna. Il-vantaġġ kbir ta 'użu tagħhom hija li huma fi kwalunkwe ħin, biss ftit sekondi, tista' tbiddel lil hinn rikonoxximent.

Kif nafu, hemm tliet punti ewlenin:

• mistrieħ meta ma tagħmel xejn miegħu, kif biss browsing il-paġna;
• pożizzjoni tal-imbagħad jerġgħu cursor fuqha;
• u jattiva meta għafast.

Il-buttuni sħiħa murija b'mod preċiż fil-browsers bħal Firefox, Safari, Opra, Chrome. Fl-istess ħin fl-Internet Explorer 9, il-buttuna mhux se jintwerew b'mod sħiħ. Per eżempju, tondi il-kantunieri, dell test u puplesija madwar il-buttuna mhux se jkun viżibbli hawn minħabba l-fatt li dawn il-proprjetajiet mhumiex appoġġjati minn dan il-browser. Madankollu, b'mod ġenerali, CSS-buttuni għas-sit jidher tajjeb f'dan il-verżjoni tal-browser. Fl-Internet Explorer 8 u verżjonijiet l-oħra taħt it-tmien fil-buttuna mhux se jkun il-volum viżibbli, iżda fl-istess ħin, biex tinżamm id-dehra ta 'gradjenti.

Jekk inqabblu l-buttuna fil-forma ta 'immaġini u buttuna CSS, id-differenza spazju fuq is-server se jkun kompletament irrilevanti. Iżda buttuna CSS tnaqqas l-għadd ta 'talbiet lill-server, iżda se jkun vantaġġ ċar meta mqabbla mal-buttuna bħala immaġini.

Jirriżulta li anke jekk l-appoġġ ta 'xi proprjetajiet CSS fl-Internet Explorer u l-ebda, dawn il-buttuni xorta se tħares aktar rebbieħa minn immaġini sempliċi, minħabba li l-unika ħaġa li se jitilfu l-utenti fl-Internet exporer, biex tara li l-estetika ta' teknoloġija moderna fuq il-Web -Disinn. Iżda huwa difett pjuttost irrilevanti.

Għal kull pożizzjoni hija mogħtija istil tagħha stess. Dawn l-istili huma miktuba .css fajl speċjali jew bejn il-lametti ras fil-paġna ħafna.

Poġġi buttuna fuq il-websajt

Bejn il-kodiċi tags ġisem miktub:

fejn

id = "button2" hawnhekk huwa l-isem mogħti lill-buttuna,

href = http: // sit / artikolu / 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 jingħataw b'rabta diretta mal-dokument mixtieq,

TEST - test stampat li jintwerew fuq il-buttuna.

Stili għall-buttuni

1. buttuna CSS Style hija rreġistrata separatament fid-dokument jew il-paġna innifsu:

2. L-ewwel buttuni CSS miktub meta jkunu wieqfa:

3. Parametri oħra huma rreġistrati, li tikkorrispondi għall-buttuna meta il-cursor jissuġġerixxu dan. Jekk f'dan il-każ, il-bidliet biss il-kulur u dell, u l-istil, kollox jibqa 'l-istess, ħlief għall-kulur u dell:

4. U l-aħħar għażla hija l-pożizzjoni tal-buttuna hija ppressata il-cursor fuqha. Spiss f'każijiet bħal dawn biss bidla fil-minimu, bħall-kulur, bħal f'dan il-każ:

CSS - buttuni sbieħ

Biex jinħoloq xaqliba, tista 'tuża l-buttuni. Huwa aħjar li l-ewwel tiġbed il-buttuna fi kwalunkwe editur immaġini, bħal Photoshop, sabiex tkun taf eżattament dak li jiġri fl-aħħar. Jekk tuża Photoshop, allura inizjalment diġà għandhom xi gradjenti, iżda barra minn hekk, tista 'tniżżel aktar u aktar, it-tip li tixtieq tikseb fuq is-sit.

Jesperimentaw bil CSS-kodiċi u jinbidlu diversi parametri, huwa possibbli li tinbidel il-buttuni sbieħ CSS, u billi l-għażla, biex jintlaħaq ir-riżultat mixtieq.

Dawn il-parametri huma:

- kulur tat-test fuq il-buttuna;

- id-daqs tat-test u buttuni;

- buttuni gradjent kulur;

- buttuni angoli raġġ;

- u l-kulur ta 'puplesija tagħha.

Strettament, inti tista sikur, mingħajr biża ', għall-esperimentazzjoni u jagħżlu l-aħjar għażla. Minkejja n-numru żgħir ta 'parametri, tista' toħloq diversi ħafna fl buttuni stil tagħhom.