Formulário com background
Formulário com background
Segue abaixo o código para se criar um formulário com background.
Veja o formulário em funcionamento aqui.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><title>Turn postcard photo into a comment form</title><style type="text/css">.commentForm{width: 497px;height: 324px;position: relative;background-image: url( 'comment_form.jpg' );background-repeat: no-repeat;}.commentForm input[type="text"], .commentForm textarea{width: 210px;left: 32px;position: absolute;background-repeat: no-repeat;border-width:0px;font-weight:bold;font-family:Arial, Sans-Serif;font-size:0.9em;}.nameField{top: 44px;height: 22px;background-image: url( 'name_bkg.jpg' );}.emailField{top: 90px;height: 22px;background-image: url( 'email_bkg.jpg' );}.websiteField{top: 133px;height: 22px;background-image: url( 'website_bkg.jpg' );}.commentField{top: 178px;height:122px;background-image: url( 'comment_bkg.jpg' );}.sendButton{position:absolute;top:268px;left:362px;width:100px;height:30px;border:solid 2px #000000;background-color:#7c6852;color:#e1cdae;}</style><script type="text/javascript">function CommentSent(){alert("You successfully pressed the button :)");}</script></head><body><div class="commentForm"><input type="text" id="nameField" class="nameField" /><input type="text" id="emailField" class="emailField" /><input type="text" id="websiteField" class="websiteField" /><textarea id="commentField" class="commentField" cols="10" rows="5"></textarea><input type="submit" id="sendButton" value="Send" class="sendButton" onclick="CommentSent()" /></div></body></html>
Não existem posts relacionados.
