Fomu za Sinema na CSS

Jifunze Kuboresha Mtazamo wa Tovuti Yako

Kujifunza jinsi ya aina ya mtindo na CSS ni njia nzuri ya kuboresha kuangalia ya tovuti yako. Fomu za HTML ni wazi kati ya mambo mabaya zaidi kwenye kurasa nyingi za wavuti. Mara kwa mara huwa na wasiwasi na watumiaji na hawapati sana kwa njia ya mtindo.

Na CSS, ambayo inaweza kubadilika. Kuchanganya CSS na vitambulisho vya juu zaidi vinaweza kutoa fomu zenye mazuri.

Badilisha rangi

Kama vile kwa maandishi, unaweza kubadilisha rangi ya mbele na rangi ya vipengele vya fomu.

Njia rahisi ya kubadilisha rangi ya nyuma ya kila kipengele cha fomu ni kutumia mali ya rangi ya nyuma kwenye lebo ya pembejeo. Kwa mfano, kanuni hii inatumika rangi ya rangi ya bluu (# 9cf) kwenye mambo yote.

pembejeo {
rangi ya background: # 9cf;
rangi: # 000;
}

Ili kubadilisha rangi ya asili ya vipengele fulani vya fomu, tu kuongeza textarea na uchague mtindo. Kwa mfano:

pembejeo, textarea, chagua {
rangi ya background: # 9cf;
rangi: # 000;
}

Hakikisha kubadili rangi ya maandishi ikiwa unafanya rangi ya asili yako giza. Rangi tofauti husaidia kufanya vipengele vya fomu visivyoonekana zaidi. Kwa mfano, maandishi juu ya rangi nyekundu ya rangi ya rangi nyekundu inasoma kwa urahisi ikiwa rangi ya maandishi ni nyeupe. Kwa mfano, msimbo huu unaweka maandishi nyeupe kwenye background nyekundu.

pembejeo, textarea, chagua {
rangi ya background: # c00;
rangi: #fff;
}

Unaweza hata kuweka rangi ya asili kwenye fomu ya fomu yenyewe. Kumbuka kwamba fomu ya fomu ni kipengele cha kuzuia , hivyo rangi hujaza katika mstatili mzima, si tu maeneo ya vipengele.

Unaweza kuongeza background ya njano kwa kipengele cha kuzuia kufanya eneo hilo liko nje, kama hii:

fomu {
rangi ya background: #ffc;
}

Ongeza mipaka

Kama ilivyo na rangi, unaweza kubadilisha mipaka ya vipengele mbalimbali vya fomu. Unaweza kuongeza mpaka mmoja karibu na fomu nzima. Hakikisha kuongeza padding, au vipengele vyako vya fomu vitaingizwa karibu na mpaka.

Hapa ni mfano wa kanuni kwa mpaka wa 1-pixel mweusi na pixels 5 za padding:

fomu {
mpaka: 1px imara # 000;
padding: 5px;
}

Unaweza kuweka mipaka karibu zaidi kuliko fomu peke yake. Badilisha mpaka wa vitu vya pembejeo ili kuwafanya wasimama:

pembejeo {
mpaka: 2px imeshuka # c00;
}

Kuwa mwangalifu unapoweka mipaka kwenye masanduku ya kuingiza wakati wanaangalia chini kama masanduku ya kuingiza basi, na watu wengine wanaweza kutambua kwamba wanaweza kujaza fomu.

Kuchanganya Sinema Features

Kwa kuweka pamoja vipengele vyako vya fomu na mawazo na baadhi ya CSS, unaweza kuanzisha fomu nzuri ya kuangalia ambayo inakamilisha muundo na mpangilio wa tovuti yako.