jQuery+CSS3网页表单元素美化
1、准备好需要用到的SVG图标。
3、书写hmtl代艨位雅剖码。<div class="zzsc-container"&爿讥旌护gt; <header class="zzsc-header bgcolor-11"> <h1>jQuery和CSS3超炫联系方式表单美化插件</h1> </header> <form class="cd-form floating-labels"> <fieldset> <legend>Account Info</legend> <div class="error-message"> <p>Please enter a valid email address</p> </div> <div class="icon"> <label class="cd-label" for="cd-name">Name</label> <input class="user" type="text" name="cd-name" id="cd-name" required> </div> <div class="icon"> <label class="cd-label" for="cd-company">Company</label> <input class="company" type="text" name="cd-company" id="cd-company"> </div> <div class="icon"> <label class="cd-label" for="cd-email">Email</label> <input class="email error" type="email" name="cd-email" id="cd-email" required> </div> </fieldset> <fieldset> <legend>Project Info</legend> <div> <h4>Budget</h4> <p class="cd-select icon"> <select class="budget"> <option value="0">Select Budget</option> <option value="1">< $5000</option> <option value="2">$5000 - $10000</option> <option value="3">> $10000</option> </select> </p> </div>
5、代码整体结构。
