CodePen Challenge # 2 vorm een ​​aanmeldingsformulier

Het is tijd voor een nieuwe CodePen-uitdaging! Deze keer wil ik dat je ons laat zien wat je kunt doen met een aanmeldingsformulier; het soort dat je zou kunnen gebruiken met een MailChimp- of Campaign Monitor-mailinglijst. Dat is alles. De beste voorbeelden worden over een week of zo tentoongesteld!

De uitdaging

We willen dat je deze vorm er geweldig uitziet. Het is een het formulier element dat een wikkelt label, een e-mail invoer en een voorleggen knop (ook een invoer) -typisch van het soort formulier dat u op uw website zou insluiten om abonnees voor een mailinglijst te verzamelen. Doe alles wat je wilt: verander de lay-out, verfijn de typografie, voeg animatie toe, maak het roze, zolang als wat dan ook gebeurt binnen de rijken van het CSS-tabblad.

Terug naar jou

Dit is wat je moet doen, in een paar doodeenvoudige stappen.

Stap 1

Ga eerst naar de demo op CodePen. Dit is hoe het eruit ziet:

Stap 2

Druk op de Vork om uw eigen kopie ervan te maken en vervolgens zo veel wijzigingen aan de CSS aan te brengen als u wilt.

Stap 3 (optioneel)

Als u bent aangemeld bij CodePen, kunt u de beschrijving bewerken door op de info knop. Gebruik dit om mensen een idee te geven van wat je hebt gedaan.

Stap 4

Raken Opslaan, u bent klaar. Laat het ons weten in de comments als je klaar bent - en laat het ons gerust weten door ons ook twewdt tweeting.

Dat is het! Alle gegevens worden in CodePen aan deze verzameling toegevoegd en de beste voorbeelden worden binnen een week getoond op Tuts +!

Veel succes en vergeet niet om Tuts + op Codepen te volgen!