Lernu plibonigi la aspekton de via retejo
Lerni kiel formi stilon kun CSS estas bonega maniero por plibonigi la aspekton de via retejo. HTML-formoj estas eble inter la plej malbelaj aferoj en plej retejoj. Ili ofte estas enuiga kaj utilita kaj ne multe ofertas laŭ la stilo.
Kun CSS, tio povas ŝanĝi. Kombini CSS kun la pli progresintaj formaj etikedoj povas liveri iujn belajn aspektojn.
Ŝanĝi la kolorojn
Same kiel kun teksto, vi povas ŝanĝi la antaŭan kaj fonkolorojn de formaj elementoj.
Facila maniero ŝanĝi la fonkoloron de preskaŭ ĉiu formo estas uzi la fonkoloraj posedaĵoj en la eniga etikedo. Ekzemple, ĉi tiu kodo aplikas bluan fonan koloron (# 9cf) sur ĉiuj elementoj.
enigo {
fonkoloro: # 9cf;
koloro: # 000;
}
Por ŝanĝi la fonan koloron de nur iuj formaj elementoj, simple aldonu textarea kaj elektu al la stilo. Ekzemple:
enigo, textarea, elektu {
fonkoloro: # 9cf;
koloro: # 000;
}
Nepre ŝanĝu la tekston-koloron se vi faros vian fonan koloron malhela. Kontrastantaj koloroj helpas al la formularo elementoj pli laŭgeblaj. Ekzemple, teksto sur malluma ruĝa fonkoloro multe pli facile legas, se la teksto estas blanka. Ekzemple, ĉi tiu kodo lokas blankan tekston sur ruĝa fono.
enigo, textarea, elektu {
fonkoloro: # c00;
koloro: #fff;
}
Vi povas eĉ meti fonkoloron sur la formo etikedo mem. Memoru, ke la etikedo estas bloko , do la koloro plenigas la tutan rektangulon, ne nur la lokojn de la elementoj.
Vi povas aldoni flavan fonon al bloko elemento por reliefigi la areon, kiel ĉi tiu:
formo {
fonkoloro: #ffc;
}
Aldoni bordojn
Kiel kun koloroj, vi povas ŝanĝi la limojn de diversaj formaj elementoj. Vi povas aldoni solan limon ĉirkaŭ la tuta formo. Nepre aldonu kompletigon, aŭ viaj formaj elementoj estos metitaj tuj apud la limo.
Jen ekzemplo de kodo por 1-piksa nigra limo kun 5 rastrumeroj de kompletigo:
formo {
limo: 1px solid # 000;
kompletigo: 5px;
}
Vi povas meti limojn ĉirkaŭ pli ol nur la formon mem. Ŝanĝi la limon de la enigaĵoj por elteni ilin:
enigo {
limo: 2px disŝiris # c00;
}
Atentu, kiam vi metas limojn sur enaj skatoloj, ĉar ili aspektas malpli kiel enaj skatoloj, kaj iuj homoj ne rimarkas, ke ili povas plenigi la formon.
Kombini Stilon Trajtoj
Kunmetante viajn formajn elementojn per penso kaj iuj CSS, vi povas agordi belan aspekton, kiu kompletigas la dezajnon kaj aranĝon de via retejo.