CSS kifungo. Faida. Styles. aesthetics

Pengine hakuna tovuti moja ni si bila rejea yake kwa wengine vifungo ukurasa. Kila mtu anataka kuleta kwa mawazo yako tovuti, na wakati huo huo kutumia aina ya njia. Katika kubuni mtandao kati yao ni pamoja na mpango wa vifungo, ambayo yanatofautiana kulingana na vigezo tofauti - wote katika ukubwa na sura, na madhara na kadhalika.

CSS vifungo ni rahisi zaidi. Kwa muda gani wanaweza kabisa kubadilisha mtindo. Na, kwa hakika, ni inatoa fursa zaidi kwa mpangilio wa tovuti kwa ujumla.

Kwa kuanzia, ili kuepuka kuchanganyikiwa na kutokuelewana, ni muhimu kuelewa baadhi ya dhana.

CSS, ambayo ni

CSS, ambayo ina maana katika tafsiri "kuachia Style Sheets", ni leo moja ya teknolojia kuu kwenye mtandao. Bila lugha hii ni uwezekano wa gharama angalau tovuti moja.

CSS-code - mwongozo kwa vivinjari zilizo na taarifa kama vile vipengele kuonyesha kwenye ukurasa na mahali pa kufanya hivyo.

Easy ya kuhifadhi maelekezo haya katika faili tofauti na css kiendelezi. Kwa upande mwingine, wanaweza kuwekwa katika mwanzo wa html-hati.

Button kwenye tovuti. Nini ni

Button, au graphic kwa urambazaji ya tovuti lazima kuvutia ya mgeni kuona kwamba alikuwa mafichoni habari ni lazima, na kwa kuongeza, itakuwa unataka click. Ikiwa ni kutosha mkali na maarufu, itakuwa kupata niliona. kifungo hii inaweza kushawishi wageni, kwa mfano, kuacha maoni kwenye tovuti, au kutuma ombi ya kujiunga na jarida kuvutia, na, bila shaka, tu kuhamisha wa mtumiaji sehemu ya tovuti.

Vitufe ni tuli, animated, nguvu, sauti na bila.

Zinaweza hasa kuundwa, kwa mfano, katika Photoshop, na kupakia picha ya tovuti, na inaweza kwa urahisi na haraka kuja na yao katika CSS.

vifungo CSS

Kufanya vitufe hivi rahisi sana. faida kubwa ya matumizi yao ni kwamba wao wakati wowote, michache tu ya sekunde, unaweza kubadilisha zaidi ya utambuzi.

Kama tunavyojua, kuna pointi tatu muhimu:

• kupumzika wakati si kufanya kitu chochote kwa hayo, kama tu kuvinjari ukurasa;
• nafasi kishale hover juu yake;
• na kuamsha wakati clicked.

vifungo full usahihi kuonyeshwa katika browsers kama Firefox, Safari, Opera, Chrome. Wakati huo huo katika Internet Explorer 9, kifungo si kuonyeshwa katika kamili. Kwa mfano, pande zote pembe, maandishi kivuli na kiharusi karibu kifungo hayataonekana hapa kutokana na ukweli kwamba mali hizi si mkono na kivinjari hiki. Hata hivyo, kwa ujumla, CSS-vifungo kwa ajili ya tovuti inaonekana vizuri katika toleo hili la kivinjari. Katika Internet Explorer 8 na matoleo mengine chini ya nane katika kifungo hayataonekana kiasi, lakini wakati huo huo, ili kudumisha muonekano wa gradients.

Kama sisi kulinganisha kifungo katika mfumo wa picha na CSS kifungo, tofauti ni nafasi kwenye kompyuta itakuwa lisilo kabisa. Lakini CSS kifungo itapunguza idadi ya maombi kwa server, lakini itakuwa faida wazi ikilinganishwa na kifungo kama picha.

Ni zinageuka kuwa hata kama msaada wa baadhi ya mali CSS katika Internet Explorer na hapana, vitufe hivi bado kuangalia kushinda zaidi ya picha rahisi, kwa sababu kitu pekee ambayo kupoteza watumiaji katika Internet Explorer, hivyo kuona aesthetics ya teknolojia ya kisasa kwenye mtandao -Design. Lakini ni immaterial kabisa kasoro.

Kwa kila nafasi imetolewa style yake mwenyewe. mitindo hii zimeandikwa katika faili css maalum au kati ya vitambulisho kichwa katika ukurasa sana.

Nafasi kifungo katika tovuti

Kati ya kanuni vitambulisho mwili imeandikwa:

ambapo

id = "button2" hapa ni jina kwa ajili ya kifungo,

href = http: // tovuti / makala / 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 wanapewa kiungo moja kwa moja na hati ya taka,

TEXT - yaliyochapishwa na kuyafanya kuonyeshwa kwenye kifungo.

Styles kwa vifungo

1. CSS Style kifungo imerekodiwa tofauti katika hati au katika ukurasa yenyewe:

2. Mwanzo kifungo kilichoandikwa CSS wakiwa katika mapumziko:

3. vigezo zaidi ni kumbukumbu, sambamba na kifungo wakati mshale zinaonyesha hivyo. Kama katika kesi hii, ni mabadiliko ya rangi na shading, na style, kila kitu inabakia sawa, isipokuwa kwa rangi na shading:

4. Na hatua ya mwisho ni nafasi ya kifungo ni taabu kishale juu yake. Mara nyingi katika hali kama hizo tu mabadiliko kiwango cha chini, kama vile rangi, kama katika kesi hii:

CSS - vifungo nzuri

Kujenga gradient, unaweza kutumia kifungo. Ni bora kwanza kuteka kifungo katika mhariri yoyote picha, kama vile Photoshop, ili kujua hasa nini kinatokea katika mwisho. Ukitumia Photoshop, basi awali tayari kuwa na baadhi ya gradients, lakini kwa kuongeza, unaweza kushusha zaidi na zaidi, aina hiyo ungependa kupata kwenye tovuti.

Majaribio na CSS-kanuni na kubadilisha vigezo mbalimbali, inawezekana na mabadiliko CSS vifungo nzuri, na kwa uteuzi, ili kufikia matokeo taka.

vigezo hizi ni:

- rangi ya maandishi juu ya kifungo,

- ukubwa wa maandishi na vifungo;

- rangi gradient vifungo;

- vifungo pembe Radius,

- na rangi ya kiharusi yake.

Kwa kusema, unaweza salama, bila hofu, kwa majaribio na kuchagua chaguo bora. Licha ya idadi ndogo ya vigezo, unaweza kuunda tofauti sana katika vifungo vyao style.