Õppige parandama veebisaidi välimust
CSS- vormingute vormide õpetamine on suurepärane võimalus veebisaidi välimuse parandamiseks. HTML-vormid on vaieldamatult enim kõige lehtede seas enamikus veebilehtedes. Nad on sageli igav ja kasulikud ning ei paku stiilile palju võimalusi.
CSS-iga saab seda muuta. CSS-i kombineerimine arenenud vormide siltidega võib pakkuda mõningaid ilusaid vorme.
Muuda värve
Nii nagu teksti puhul, saate muuta vormielementide esiplaani ja taustavärve.
Peaaegu iga vormielemendi taustavärvi muutmiseks on lihtne kasutada sisendmärgis taustavärvi vara. Näiteks rakendab see kood kõikidele elementidele sinise taustavärvi (# 9cf).
sisend {
taustavärv: # 9cf;
värv: # 000;
}
Ainult teatud vormielementide taustavärvi muutmiseks lisage lihtsalt tekstarea ja valige stiil. Näiteks:
sisend, tekstarea, valige {
taustavärv: # 9cf;
värv: # 000;
}
Kui muudate oma taustavärvi pimedas, muutke see kindlasti teksti värvi. Kontrastsed värvid muudavad vormielemendid loetavamaks. Näiteks teksti tume punase taustavärvi on palju lihtsam lugeda, kui teksti värv on valge. Näiteks asetab see kood valge teksti punase taustaga.
sisend, tekstarea, valige {
taustavärv: # c00;
värv: #fff;
}
Saate isegi vormi sildi taustvärvi ise panna. Pea meeles, et vormi silt on plokk element , nii et värv täidab kogu ristküliku, mitte ainult elementide asukohti.
Blokeerimiselemendi saate kollase tausta lisada ala välja paistma, näiteks:
vorm {
taustavärv: #ffc;
}
Lisa piirid
Nagu ka värvide puhul, saate muuta erinevate vormielementide piire. Saate lisada kogu vormi ümber ühe piiri. Lisage kindlasti polsterdus või vormielemendid kinni kohale piiri lähedal.
Siin on näide koodist 1-pikslise musta piirjooni koos 5 piksliga padding:
vorm {
piiri: 1px tahke # 000;
padding: 5px;
}
Võite panna piirid rohkem kui lihtsalt vorm ise. Muutke sisendnäidiste piiri, et need eristuksid:
sisend {
border: 2px dashed # c00;
}
Olge ettevaatlik, kui panete sisendkasti piirid, kuna need näevad välja vähem kui sisendkastid, ja mõned inimesed ei pruugi aru saada, et nad võivad vormi täita.
Kombineeri stiili omadused
Koostades oma vormielemendid mõtte ja mõne CSS-iga, saate luua kena välimuse, mis täiendab saidi disaini ja kujundust.