在页面底部放置一个注册表单 [英] Place a sign-up form at the bottom of the page

问题描述

大家好。

如果这不是发布我的问题的合适地点我会批评，如果你能指出我正确的方向并帮助我解决问题，我会很感激。我已经推出了新网站，目前我只有即将到来的网页。我使用了一些模板使它看起来像我想要的，但是我不熟悉编码并需要一些帮助将所有内容组合在一起。

所以我的主页上有html代码可以看到at：welovetranslating.com



html如下：



< meta charset =utf -8/>



< meta http-equiv =X-UA-Compatiblecontent =IE = edge，chrome = 1/>



< title>网站本地化和翻译|我们喜欢翻译< / title>



< meta name =descriptioncontent =欢迎来到我们喜欢翻译 - 满足您所有翻译和本地化需求的终极提供商。 />



< meta name =viewportcontent =width = device-width，initial-scale = 1.0/>





< meta charset =utf-8/>

< title>< / title>

< link href =http://upagge.com/style.css =stylesheettype =text / css/>

< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js>< / script>

< script type =text / javascriptsrc =javascripts / jquery.tipsy.js>< / script>

< script type =text / javascript>

$（函数（）{

$（'＃tipsy'）。tipsy（{淡出淡出：真，重力：'s'}）;

}）;

< / script><！ - [if IE]>

< script src =http：// html5shiv。 googlecode.com/svn/trunk/html5.js\"></script>

<！[endif] - >





< div class =wrapper>

< img alt =YourLogosrc =http：// upag ge.com/images/logo.pngtitle =我们为您提供所有翻译和本地化需求！ />



< div class =hr>

< / div>



< h1>

等待它......等待它......< / h1>



< p>

看起来我们提出了另一个很棒的想法，需要一些时间来实现它。请继续关注！< / p>

< section class =progress>



< div class =progress- bar-containerid =tipsytitle =65％Complete>

< article class =progress-barstyle =width：65％>< / article> ;< / div>



< article class =txt-launch-day-hat>< / article>



< / section>



< blockquote>

< / blockquote>

< p align =left>& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;

& nbsp;& nbsp;& nbsp;& nbsp;我们喜欢被跟随：< / p>

< blockquote>

< / blockquote>

< br />



< div align =left>

< a href =https://twitter.com/WeLoveTRAN目标=_ blank>< img alt =src =http://welovetranslating.com/welcome/wp-content/uploads/2013/08/twitter-red-check-circle-social-media-icon。 pngborder =0width =100/>< / a>< a href =http://www.linkedin.com/in/welovetranslatingtarget =_ blank>< img alt =src =http://welovetranslating.com/welcome/wp-content/uploads/2013/08/linkeden-red-check-circle-social-media-icon.pngborder =0width = 100/>< / a>< a href =https://www.facebook.com/dmitry.kornyukhov\"target =_ blank>< img alt =src =http： //welovetranslating.com/welcome/wp-content/uploads/2013/08/Facebook-red-check-circle-social-media-icon.pngborder =0width =100/>< / a>< / div>< / div>



我想添加注册表单在我的页面底部（在中间，在社交网络图标旁边。）但我不知道该怎么做，并会感谢任何提示或建议。如果你能帮助我，我将非常感激。



注册表格的代码如下：



<！DOCTYPE html>

<！ - [if lt IE 7]> < html class =no-js ie6 oldielang =en> <！[endif] - >

<！ - [if IE 7]> < html class =no-js ie7 oldielang =en> <！[endif] - >

<！ - [if IE 8]> < html class =no-js ie8 oldielang =en> <！[endif] - >

<！ - [if gt IE 8]><！ - > < html class =no-jslang =en> <！ - <！[endif] - >

< head>

< meta charset =utf-8>

< meta http-equiv =X-UA-Compatiblecontent =IE = edge，chrome = 1>

< title>网站本地化和翻译|我们喜欢翻译< / title>

< meta name =descriptioncontent =欢迎来到我们喜欢的翻译 - 满足您所有翻译和本地化需求的最终提供商。>

< meta name =viewportcontent =width = device-width，initial-scale = 1.0>





<！ - Google字体CSS - >

< link href ='// fonts.googleapis.com/css?family=Pontano+Sans'rel ='样式表' type ='text / css'>

< link href ='// fonts.googleapis.com/css?family=Bevan'rel ='stylesheet'type ='text / css'> ;

<！ - Bootstrap和默认样式 - >

< link rel =stylesheethref =http://welovetranslating.com/welcome /wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap.min.css\">

< link rel =stylesheethref = http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap-responsive.m in.css>

< link rel =stylesheethref =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes /default/style.css\">

< style type =text / css>

/ *计算样式* /

.progress-striped .bar，.progress.active .bar {background-color：＃E85C41} .progress .bar {

background-color：＃da4c31;

background-image：-moz-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-ms-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-webkit-gradient（线性，0 0,0 100％，从（＃E85C41）到（＃c53418））;

background-image： - webkit-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：-o-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：线性渐变（顶部，＃E85C41，＃c53418）;

background-repeat：repeat-x;

filter：progid：DXImageTransform.Microsoft。 gradient（startColorstr ='＃e85c41'，endColorstr ='＃c53418' ，GradientType = 0）;

}

.countdown_section {

background-color：＃da4c31;

background -image：-moz-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-ms-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-webkit-gradient（线性，0 0,0 100％，从（＃E85C41）到（＃c53418））;

background-image：-webkit - 线性渐变（顶部，＃E85C41，＃c53418）;

background-image：-o-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：线性渐变（顶部，＃E85C41，＃c53418）;

background-repeat：repeat-x;

filter：progid：DXImageTransform.Microsoft.gradient （startColorstr ='＃e85c41'，endColorstr ='＃c53418'，GradientType = 0）;

}



/ *背景样式* /

html {

身高：100％;

背景：#ffffff;

}

身体{

身高：100％;

背景：反式父母;

}



/ *文字样式* /

身体{

font-family：'Pontano Sans';

}





h1，h2，h3，h4，h5，h6 {

font-family：'Bevan';;

font-weight：normal;

}



按钮{

font-family：'Bevan'; }



身体{

颜色：＃999999;

}

< br $>




h1，h2，h3，h4，h5，h6 {

颜色：＃444444;

}





a，a：访问过，a：悬停，a：活跃{

颜色：＃E85C41;

}



.btn，

.gform_button {

颜色：白色;

text-shadow：0 -1px 0 rgba（0,0,0,0.3）;

background-color：＃da4c31;

background-image：-moz-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：-ms-linear-gradient（顶部，＃ E85C41，＃c53418）;

background-image：-webkit-gradient（线性，0 0,0 100％，从（＃E85C41）到（＃c53418））;

background-image：-webkit-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-o-linear-gradient（top，＃E85C41，＃c53418） ;

background-image：线性渐变（顶部，＃E85C41，＃c53418）;

background-re泥炭：repeat-x;

filter：progid：DXImageTransform.Microsoft.gradient（startColorstr ='＃e85c41'，endColorstr ='＃c53418'，GradientType = 0）;

border-color：＃c53418＃c53418＃802210;

border-color：rgba（0,0,0,0.1）rgba（0,0,0,0.1）rgba（0,0， 0,0.25）;

* background-color：＃c53418;

filter：progid：DXImageTransform.Microsoft.gradient（enabled = false）;

}

.btn：悬停，

.btn：有效，

.btn.active，

.btn.disabled，

.btn [已禁用]，

.gform_button：悬停，

.gform_button：有效，

.gform_button.active，

.gform_button.disabled，

.gform_button [disabled] {

background-color：＃c53418;

*背景颜色：＃ae2e15;

}

.btn：活跃，

.btn.active ，

.gform_button：有效，

.gform_button.active {

背景颜色：＃972812 \9;

}

＃csp3-p rogressbar span，

.countdown_section {

颜色：白色;

text-shadow：0 -1px 0 rgba（0,0,0， 0.3）;

}

.btn：悬停{

颜色：白色;

text-shadow：0 -1px 0 rgba（0,0,0,0.3）;

}

输入[type ='text'] {

border-颜色：＃c53418＃c53418＃802210;

}

输入[type ='text']：焦点{

border-color：rgba （195,53,24,0.8）;

webkit-box-shadow：inset 0 1px 1px rgba（0,0,0,0.075），0 0 8px rgba（195,53,24， 0.6）;

-moz-box-shadow：inset 0 1px 1px rgba（0,0,0,0.075），0 0 8px rgba（195,53,24,0.6）;

box-shadow：inset 0 1px 1px rgba（0,0,0,0.075），0 0 8px rgba（195,53,24,0.6）;

}



/ *横向电话和向下* /

@media（最大宽度：480px）{

＃csp3-电子邮件{

margin-bottom：10px;

-webkit-border-radius：3px;

-moz-border-radius：3px;

border-radius：3px;

}

＃csp3-email，＃csp3-fname，＃csp3-lname {

宽度：97％！重要;

}

＃csp3-fname {

margin-right：0;

}

#csp3-subscribe-btn {

-webkit-border-radius：3px;

-moz-border-radius：3px ;

border-radius：3px;

}

.csp3-form-wrapper {

text-align ：left;

}



＃csp3-content {

padding：15px;

margin-top：20px;

}

.input-append {

display：block！important;

}

html {

身高：汽车;

}



＃csp3-email {

margin-bottom：10px;

}

#csp3-headline {

行高：46px;

}

.countdown_section {

margin-bottom：10px;

}



}



/ *横向手机到肖像平板电脑* /

@media（max-width：767px）{

＃csp3-fname，

＃csp3-lname {

box-sizing：inherit ;

宽度：90％;

}

＃csp3-email {

box-sizing：inherit;

宽度：90％;

}



＃csp3-subscribe-btn {

显示：阻止;

}



＃csp3-subscribe-btn {

-webkit- border-radius：3px;

-moz-border-radius：3px;

}



＃csp3 -email {

margin-bottom：10px;

-webkit-border-radius：3px;

-moz-border-radius：3px ;

border-radius：3px;

}



＃csp3-fname，＃csp3-fname {

保证金底部：10px

}



.input-append {

显示：阻止！重要;

}



＃csp3-email，＃csp3-subscribe-btn {

保证金：自动;

}



＃csp3-email {

margin-bottom：10px;

}



}



/ *适用于风景和桌面的平板电脑* /

@media （最小宽度：768px）和（最大宽度：979px）{}



/ *大型桌面* /

@media（最小宽度：1200px）{}



< / style>

<！ - JS - >

< script src =http://welovetranslating.com/welcome/wp-includes/js/jquery/jquery.js>< / script>

< script src =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/js/bootstrap.js>< / script>

<！ - FitVid - >

< script src =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon -pro /主题/默认/ JS / jquery.fitvids.js>< /脚本& gt;

< script src =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/script.js >< / script>

<！ - Google Analytics - >

< script type ='text / javascript'>



var _gaq = _gaq || [];

_gaq.push（['_ setAccount'，'UA-43649157-1']）;

_gaq.push（['_ trackPageview']）;



（function（）{

var ga = document.createElement（'script'）; ga.type ='text / javascript'; ga.async = true;

ga.src =（'https：'== document.location.protocol？'https：// ssl'：'http：// www'）+'。 google-analytics.com/ga.js';

var s = document.getElementsByTagName（'script'）[0]; s.parentNode.insertBefore（ga，s）;

}）（）;



< / script><！ - Modernizr - >

< script src =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/modernizr.min.js>< / script>





< / head>

< body>

< div class = container>

< div class =row>

< div class =span10 offset1>

& lt; div id =csp3-content>









< div id =csp3-description>< p>让&＃8217;保持联系！获取最新消息和独家优惠！< / p>

< / div>

< form id =csp3-formclass =form-inline method =post>< input id =csp3-refname =reftype =hiddenvalue =/>< input id =csp3-ajax-urltype =隐藏的value =http://welovetranslating.com/welcome/wp-admin/admin-ajax.php/>< div id =csp3-alertclass =alert>< / div> < div class =csp3-form-wrapper>< input id =csp3-fnamename =fnameclass =input-mediumtype =textplaceholder =First Name/> < input id =csp3-lnamename =lnameclass =input-largetype =textplaceholder =Last Name/>< span class =sep>< / span> ;< div class =input-append>< input id =csp3-emailname =emailclass =input-xlargetype =textplaceholder =Enter your Email/> < button id =csp3-subscribe-btntype =submitclass =btn btn-large action> Go For It< / button>< / div>< / div>< / form>

< div id =csp3-social-profiles>< / div>

< / div><！ - ＃csp3-content的结尾 - >

< / div><！ - ！结束.span8 - >

< / div> <！ - ！结束.row - >

< / div> <！ - ！ .container结束 - >





<！ - Belatedpng - >

<！ - [if lt IE 7]>

< script src =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro /themes/default/js/dd_belatedpng.js\"></script>

< script> DD_belatedPNG.fix（'img，.png_bg'）;< / script>

<！[endif] - >

<！ - 电子邮件表格字符串 - >

< script>

var seed_csp3_err_msg = {

'msgdefault'：'输入您的电子邮件'，

'msg600'：'猜猜看！你&＃039;已经订阅了:)'，

'msg500'：'错误，请再试一次。'，

'msg400'：'请输入有效电子邮件。'，

'msg200'：'你&＃039;我们很快就会收到通知！'

};

< / script> ;< script>

jQuery（document）.ready（function（$）{$（＃csp3-content）。fadeIn（slow）。css（display，inline -block）; $（＃csp3-description）。fitVids（）; $（＃csp3-form）。off（）;}）;< / script>

< ; - [如果是IE 9]>

< script>

jQuery（document）.ready（function（$）{$。supersized（{slides ：[{image：''}]}）;}）;

< / script>

<！[endif] - >

< / body>

< / html>



提前感谢您的帮助！

Hi guys.
I do appolagize if this is not the right place to post my issue and would appreciate it if your could point my in the right direction and help me to solve my problem. I've launched the new website and as for now I only got the Coming soon page. I used a few templates to make it look like I wanted, however I'm not familiar with coding and need some help to put everything together.
So I have html code for my homepage which could be seen at: welovetranslating.com

The html is as follows:

<meta charset="utf-8" />

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

<title>Website Localization and Translation | We Love Translating</title>

<meta name="description" content="Welcome to We Love Translating - the ultimate provider for all your translation and localization needs." />

<meta name="viewport" content="width=device-width, initial-scale=1.0" />


<meta charset="utf-8" />
<title></title>
<link href="http://upagge.com/style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
<script type="text/javascript" src="javascripts/jquery.tipsy.js"></script>
<script type="text/javascript">
$(function() {
$('#tipsy').tipsy({fade: true, gravity: 's'});
});
</script><!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->


<div class="wrapper">
<img alt="YourLogo" src="http://upagge.com/images/logo.png" title="We got all you translation and localization needs covered!" />

<div class="hr">
</div>

<h1>
Wait for it... wait for it...</h1>

<p>
It seems like we came up with another awesome idea and need some time to implement it. Stay tuned!</p>
<section class="progress">

<div class="progress-bar-container" id="tipsy" title="65% Complete">
<article class="progress-bar" style="width:65%"></article></div>

<article class="txt-launch-day-hat"></article>

</section>

<blockquote>
</blockquote>
<p align="left">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp; We Love Being Followed:</p>
<blockquote>
</blockquote>
<br />

<div align="left">
<a href="https://twitter.com/WeLoveTRAN" target="_blank"><img alt="" src="http://welovetranslating.com/welcome/wp-content/uploads/2013/08/twitter-red-check-circle-social-media-icon.png" border="0" width="100" /></a><a href="http://www.linkedin.com/in/welovetranslating" target="_blank"><img alt="" src="http://welovetranslating.com/welcome/wp-content/uploads/2013/08/linkeden-red-check-circle-social-media-icon.png" border="0" width="100" /></a><a href="https://www.facebook.com/dmitry.kornyukhov" target="_blank"><img alt="" src="http://welovetranslating.com/welcome/wp-content/uploads/2013/08/Facebook-red-check-circle-social-media-icon.png" border="0" width="100" /></a></div></div>

And I would like to add the signup form at the bottom of my page (in the middle, right next to the social network icons.) But I have no idea how to do it and would appreciate any tips or suggestions. If you can help me I would be really grateful.

The code for signup form is given bellow:

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Website Localization and Translation | We Love Translating</title>
<meta name="description" content="Welcome to We Love Translating - the ultimate provider for all your translation and localization needs.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<!-- Google Fonts CSS -->
<link href='//fonts.googleapis.com/css?family=Pontano+Sans' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Bevan' rel='stylesheet' type='text/css'>
<!-- Bootstrap and default Style -->
<link rel="stylesheet" href="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap-responsive.min.css">
<link rel="stylesheet" href="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/style.css">
<style type="text/css">
/* calculated styles */
.progress-striped .bar, .progress.active .bar{background-color:#E85C41}.progress .bar {
background-color: #da4c31;
background-image: -moz-linear-gradient(top,#E85C41,#c53418);
background-image: -ms-linear-gradient(top,#E85C41,#c53418);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#E85C41),to(#c53418));
background-image: -webkit-linear-gradient(top,#E85C41,#c53418);
background-image: -o-linear-gradient(top,#E85C41,#c53418);
background-image: linear-gradient(top,#E85C41,#c53418);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e85c41', endColorstr='#c53418', GradientType=0);
}
.countdown_section {
background-color: #da4c31;
background-image: -moz-linear-gradient(top,#E85C41,#c53418);
background-image: -ms-linear-gradient(top,#E85C41,#c53418);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#E85C41),to(#c53418));
background-image: -webkit-linear-gradient(top,#E85C41,#c53418);
background-image: -o-linear-gradient(top,#E85C41,#c53418);
background-image: linear-gradient(top,#E85C41,#c53418);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e85c41', endColorstr='#c53418', GradientType=0);
}

/* Background Style */
html{
height:100%;
background: #ffffff;
}
body{
height:100%;
background: transparent;
}

/* Text Styles */
body{
font-family: 'Pontano Sans';
}


h1, h2, h3, h4, h5, h6{
font-family: 'Bevan';;
font-weight:normal;
}

button{
font-family: 'Bevan'; }

body{
color:#999999;
}



h1, h2, h3, h4, h5, h6{
color:#444444;
}


a, a:visited, a:hover, a:active{
color:#E85C41;
}

.btn,
.gform_button {
color: white;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
background-color: #da4c31;
background-image: -moz-linear-gradient(top,#E85C41,#c53418);
background-image: -ms-linear-gradient(top,#E85C41,#c53418);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#E85C41),to(#c53418));
background-image: -webkit-linear-gradient(top,#E85C41,#c53418);
background-image: -o-linear-gradient(top,#E85C41,#c53418);
background-image: linear-gradient(top,#E85C41,#c53418);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e85c41', endColorstr='#c53418', GradientType=0);
border-color: #c53418 #c53418 #802210;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
*background-color: #c53418;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.btn:hover,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled],
.gform_button:hover,
.gform_button:active,
.gform_button.active,
.gform_button.disabled,
.gform_button[disabled] {
background-color: #c53418;
*background-color: #ae2e15;
}
.btn:active,
.btn.active,
.gform_button:active,
.gform_button.active {
background-color: #972812 \9;
}
#csp3-progressbar span,
.countdown_section {
color: white;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.btn:hover {
color: white;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
input[type='text'] {
border-color: #c53418 #c53418 #802210;
}
input[type='text']:focus {
border-color: rgba(195,53,24,0.8);
webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(195,53,24,0.6);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(195,53,24,0.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(195,53,24,0.6);
}

/* Landscape phones and down */
@media (max-width: 480px) {
#csp3-email{
margin-bottom: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
#csp3-email,#csp3-fname,#csp3-lname{
width:97% !important;
}
#csp3-fname{
margin-right:0;
}
#csp3-subscribe-btn{
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.csp3-form-wrapper {
text-align:left;
}

#csp3-content {
padding: 15px;
margin-top: 20px;
}
.input-append{
display:block !important;
}
html{
height:auto;
}

#csp3-email{
margin-bottom: 10px;
}
#csp3-headline {
line-height: 46px;
}
.countdown_section{
margin-bottom: 10px;
}

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#csp3-fname,
#csp3-lname{
box-sizing:inherit;
width:90%;
}
#csp3-email{
box-sizing:inherit;
width:90%;
}

#csp3-subscribe-btn{
display:block;
}

#csp3-subscribe-btn{
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}

#csp3-email{
margin-bottom: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

#csp3-fname,#csp3-fname{
margin-bottom: 10px
}

.input-append{
display:block !important;
}

#csp3-email,#csp3-subscribe-btn{
margin:auto;
}

#csp3-email{
margin-bottom:10px;
}

}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { }

/* Large desktop */
@media (min-width: 1200px) { }

</style>
<!-- JS -->
<script src="http://welovetranslating.com/welcome/wp-includes/js/jquery/jquery.js"></script>
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/js/bootstrap.js"></script>
<!-- FitVid -->
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/jquery.fitvids.js"></script>
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/script.js"></script>
<!-- Google Analytics -->
<script type='text/javascript'>

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-43649157-1']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script><!-- Modernizr -->
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/modernizr.min.js"></script>


</head>
<body>
<div class="container">
<div class="row">
<div class="span10 offset1">
<div id="csp3-content">




<div id="csp3-description"><p>Let&#8217;s stay in touch! Get the latest news and exclusive offers!</p>
</div>
<form id="csp3-form" class="form-inline" method="post"><input id="csp3-ref" name="ref" type="hidden" value="" /><input id="csp3-ajax-url" type="hidden" value="http://welovetranslating.com/welcome/wp-admin/admin-ajax.php" /><div id="csp3-alert" class="alert"></div><div class="csp3-form-wrapper"><input id="csp3-fname" name="fname" class="input-medium" type="text" placeholder="First Name"/><input id="csp3-lname" name="lname" class="input-large" type="text" placeholder="Last Name"/><span class="sep"></span><div class="input-append"><input id="csp3-email" name="email" class="input-xlarge" type="text" placeholder="Enter Your Email"/><button id="csp3-subscribe-btn" type="submit" class="btn btn-large action">Go For It</button></div></div></form>
<div id="csp3-social-profiles"></div>
</div><!-- end of #csp3-content -->
</div><!--! end of .span8 -->
</div> <!--! end of .row -->
</div> <!--! end of .container -->


<!-- Belatedpng -->
<!--[if lt IE 7 ]>
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/dd_belatedpng.js"></script>
<script>DD_belatedPNG.fix('img, .png_bg');</script>
<![endif]-->
<!-- Email Form Strings -->
<script>
var seed_csp3_err_msg={
'msgdefault':'Enter Your Email',
'msg600':'Guess what! You&#039;re already subscribed :)',
'msg500':'Error, please try again.',
'msg400':'Please enter a valid email.',
'msg200':'You&#039;ll be notified soon!'
};
</script><script>
jQuery(document).ready(function($){$("#csp3-content").fadeIn("slow").css("display","inline-block");$("#csp3-description").fitVids();$("#csp3-form").off();});</script>
<!--[if lt IE 9]>
<script>
jQuery(document).ready(function($){$.supersized({slides:[ {image : ''} ]});});
</script>
<![endif]-->
</body>
</html>

Thanks in advance for your help!

推荐答案

（function（）{

(function() {

（'＃tipsy'）。tipsy（{fade：true，gravity：'s '}）;

}）;

< / script>< ; - [如果IE]>

< script src =http://html5shiv.googlecode.com/svn/trunk/html5.js>< / script>

<！[endif] - >





< div class =wrapper> ;

< img alt =YourLogosrc =http://upagge.com/images/logo.pngtitle =我们为您提供所有翻译和本地化需求！ />



< div class =hr>

< / div>



< h1>

等待它......等待它......< / h1>



< p>

看起来我们提出了另一个很棒的想法，需要一些时间来实现它。请继续关注！< / p>

< section class =progress>



< div class =progress- bar-containerid =tipsytitle =65％Complete>

< article class =progress-barstyle =width：65％>< / article> ;< / div>



< article class =txt-launch-day-hat>< / article>



< / section>



< blockquote>

< / blockquote>

< p align =left>& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;& nbsp;

& nbsp;& nbsp;& nbsp;& nbsp;我们喜欢被跟随：< / p>

< blockquote>

< / blockquote>

< br />



< div align =left>

< a href =https://twitter.com/WeLoveTRAN目标=_ blank>< img alt =src =http://welovetranslating.com/welcome/wp-content/uploads/2013/08/twitter-red-check-circle-social-media-icon。 pngborder =0width =100/>< / a>< a href =http://www.linkedin.com/in/welovetranslatingtarget =_ blank>< img alt =src =http://welovetranslating.com/welcome/wp-content/uploads/2013/08/linkeden-red-check-circle-social-media-icon.pngborder =0width = 100/>< / a>< a href =https://www.facebook.com/dmitry.kornyukhov\"target =_ blank>< img alt =src =http： //welovetranslating.com/welcome/wp-content/uploads/2013/08/Facebook-red-check-circle-social-media-icon.pngborder =0width =100/>< / a>< / div>< / div>



我想添加注册表单在我的页面底部（在中间，在社交网络图标旁边。）但我不知道该怎么做，并会感谢任何提示或建议。如果你能帮助我，我将非常感激。



注册表格的代码如下：



<！DOCTYPE html>

<！ - [if lt IE 7]> < html class =no-js ie6 oldielang =en> <！[endif] - >

<！ - [if IE 7]> < html class =no-js ie7 oldielang =en> <！[endif] - >

<！ - [if IE 8]> < html class =no-js ie8 oldielang =en> <！[endif] - >

<！ - [if gt IE 8]><！ - > < html class =no-jslang =en> <！ - <！[endif] - >

< head>

< meta charset =utf-8>

< meta http-equiv =X-UA-Compatiblecontent =IE = edge，chrome = 1>

< title>网站本地化和翻译|我们喜欢翻译< / title>

< meta name =descriptioncontent =欢迎来到我们喜欢的翻译 - 满足您所有翻译和本地化需求的最终提供商。>

< meta name =viewportcontent =width = device-width，initial-scale = 1.0>





<！ - Google字体CSS - >

< link href ='// fonts.googleapis.com/css?family=Pontano+Sans'rel ='样式表' type ='text / css'>

< link href ='// fonts.googleapis.com/css?family=Bevan'rel ='stylesheet'type ='text / css'> ;

<！ - Bootstrap和默认样式 - >

< link rel =stylesheethref =http://welovetranslating.com/welcome /wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap.min.css\">

< link rel =stylesheethref = http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap-responsive.m in.css>

< link rel =stylesheethref =http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes /default/style.css\">

< style type =text / css>

/ *计算样式* /

.progress-striped .bar，.progress.active .bar {background-color：＃E85C41} .progress .bar {

background-color：＃da4c31;

background-image：-moz-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-ms-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-webkit-gradient（线性，0 0,0 100％，从（＃E85C41）到（＃c53418））;

background-image： - webkit-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：-o-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：线性渐变（顶部，＃E85C41，＃c53418）;

background-repeat：repeat-x;

filter：progid：DXImageTransform.Microsoft。 gradient（startColorstr ='＃e85c41'，endColorstr ='＃c53418' ，GradientType = 0）;

}

.countdown_section {

background-color：＃da4c31;

background -image：-moz-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-ms-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-webkit-gradient（线性，0 0,0 100％，从（＃E85C41）到（＃c53418））;

background-image：-webkit - 线性渐变（顶部，＃E85C41，＃c53418）;

background-image：-o-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：线性渐变（顶部，＃E85C41，＃c53418）;

background-repeat：repeat-x;

filter：progid：DXImageTransform.Microsoft.gradient （startColorstr ='＃e85c41'，endColorstr ='＃c53418'，GradientType = 0）;

}



/ *背景样式* /

html {

身高：100％;

背景：#ffffff;

}

身体{

身高：100％;

背景：反式父母;

}



/ *文字样式* /

身体{

font-family：'Pontano Sans';

}





h1，h2，h3，h4，h5，h6 {

font-family：'Bevan';;

font-weight：normal;

}



按钮{

font-family：'Bevan'; }



身体{

颜色：＃999999;

}

< br $>




h1，h2，h3，h4，h5，h6 {

颜色：＃444444;

}





a，a：访问过，a：悬停，a：活跃{

颜色：＃E85C41;

}



.btn，

.gform_button {

颜色：白色;

text-shadow：0 -1px 0 rgba（0,0,0,0.3）;

background-color：＃da4c31;

background-image：-moz-linear-gradient（顶部，＃E85C41，＃c53418）;

background-image：-ms-linear-gradient（顶部，＃ E85C41，＃c53418）;

background-image：-webkit-gradient（线性，0 0,0 100％，从（＃E85C41）到（＃c53418））;

background-image：-webkit-linear-gradient（top，＃E85C41，＃c53418）;

background-image：-o-linear-gradient（top，＃E85C41，＃c53418） ;

background-image：线性渐变（顶部，＃E85C41，＃c53418）;

background-re泥炭：repeat-x;

filter：progid：DXImageTransform.Microsoft.gradient（startColorstr ='＃e85c41'，endColorstr ='＃c53418'，GradientType = 0）;

border-color：＃c53418＃c53418＃802210;

border-color：rgba（0,0,0,0.1）rgba（0,0,0,0.1）rgba（0,0， 0,0.25）;

* background-color：＃c53418;

filter：progid：DXImageTransform.Microsoft.gradient（enabled = false）;

}

.btn：悬停，

.btn：有效，

.btn.active，

.btn.disabled，

.btn [已禁用]，

.gform_button：悬停，

.gform_button：有效，

.gform_button.active，

.gform_button.disabled，

.gform_button [disabled] {

background-color：＃c53418;

*背景颜色：＃ae2e15;

}

.btn：活跃，

.btn.active ，

.gform_button：有效，

.gform_button.active {

背景颜色：＃972812 \9;

}

＃csp3-p rogressbar span，

.countdown_section {

颜色：白色;

text-shadow：0 -1px 0 rgba（0,0,0， 0.3）;

}

.btn：悬停{

颜色：白色;

text-shadow：0 -1px 0 rgba（0,0,0,0.3）;

}

输入[type ='text'] {

border-颜色：＃c53418＃c53418＃802210;

}

输入[type ='text']：焦点{

border-color：rgba （195,53,24,0.8）;

webkit-box-shadow：inset 0 1px 1px rgba（0,0,0,0.075），0 0 8px rgba（195,53,24， 0.6）;

-moz-box-shadow：inset 0 1px 1px rgba（0,0,0,0.075），0 0 8px rgba（195,53,24,0.6）;

box-shadow：inset 0 1px 1px rgba（0,0,0,0.075），0 0 8px rgba（195,53,24,0.6）;

}



/ *横向电话和向下* /

@media（最大宽度：480px）{

＃csp3-电子邮件{

margin-bottom：10px;

-webkit-border-radius：3px;

-moz-border-radius：3px;

border-radius：3px;

}

＃csp3-email，＃csp3-fname，＃csp3-lname {

宽度：97％！重要;

}

＃csp3-fname {

margin-right：0;

}

#csp3-subscribe-btn {

-webkit-border-radius：3px;

-moz-border-radius：3px ;

border-radius：3px;

}

.csp3-form-wrapper {

text-align ：left;

}



＃csp3-content {

padding：15px;

margin-top：20px;

}

.input-append {

display：block！important;

}

html {

身高：汽车;

}



＃csp3-email {

margin-bottom：10px;

}

#csp3-headline {

行高：46px;

}

.countdown_section {

margin-bottom：10px;

}



}



/ *横向手机到肖像平板电脑* /

@media（max-width：767px）{

＃csp3-fname，

＃csp3-lname {

box-sizing：inherit ;

宽度：90％;

}

＃csp3-email {

box-sizing：inherit;

宽度：90％;

}



＃csp3-subscribe-btn {

显示：阻止;

}



＃csp3-subscribe-btn {

-webkit- border-radius：3px;

-moz-border-radius：3px;

}



＃csp3 -email {

margin-bottom：10px;

-webkit-border-radius：3px;

-moz-border-radius：3px ;

border-radius：3px;

}



＃csp3-fname，＃csp3-fname {

保证金底部：10px

}



.input-append {

显示：阻止！重要;

}



＃csp3-email，＃csp3-subscribe-btn {

保证金：自动;

}



＃csp3-email {

margin-bottom：10px;

}



}



/ *适用于风景和桌面的平板电脑* /

@media （最小宽度：768px）和（最大宽度：979px）{}



/ *大型桌面* /

@media（最小宽度：1200px）{}



< / style>

<！ - JS - >

< script src =http://welovetranslating.com/welcome/wp-includes/js/jquery/jquery.js>< / script>

< script src=\"http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/js/bootstrap.js\"></script>

<!-- FitVid -->

<script src=\"http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon -pro/themes/default/js/jquery.fitvids.js\"></script& gt;

<script src=\"http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/script.js\"></script>

<!-- Google Analytics -->

<script type=’text/javascript’>



\t\t var _gaq = _gaq || [];

\t\t _gaq.push([’_setAccount’, ’UA-43649157-1’]);

\t\t _gaq.push([’_trackPageview’]);



\t\t (function() {

\t\t var ga = document.createElement(’script’); ga.type = ’text/javascript’; ga.async = true;

\t\t ga.src = (’https:’ == document.location.protocol ? ’https://ssl’ : ’http://www’) + ’.google-analytics.com/ga.js’;

\t\t var s = document.getElementsByTagName(’script’)[0]; s.parentNode.insertBefore(ga, s);

\t\t })();



\t\t</script><!-- Modernizr -->

<script src=\"http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/modernizr.min.js\"></script>



\t\t

\t</head>

<body>

\t<div class=\"container\">

\t\t<div class=\"row\">

\t\t\t<div class=\"span10 offset1\">

\t\t\t\t& lt;div id=\"csp3-content\">

\t\t\t\t\t

\t\t\t\t\t





\t\t\t\t\t<div id=\"csp3-description\"><p>Let&#8217;s stay in touch! Get the latest news and exclusive offers!</p>

</div>

\t\t\t\t\t<form id=\"csp3-form\" class=\"form-inline\" method=\"post\"><input id=\"csp3-ref\" name=\"ref\" type=\"hidden\" value=\"\" /><input id=\"csp3-ajax-url\" type=\"hidden\" value=\"http://welovetranslating.com/welcome/wp-admin/admin-ajax.php\" /><div id=\"csp3-alert\" class=\"alert\"></div><div class=\"csp3-form-wrapper\"><input id=\"csp3-fname\" name=\"fname\" class=\"input-medium\" type=\"text\" placeholder=\"First Name\"/><input id=\"csp3-lname\" name=\"lname\" class=\"input-large\" type=\"text\" placeholder=\"Last Name\"/><span class=\"sep\"></span><div class=\"input-append\"><input id=\"csp3-email\" name=\"email\" class=\"input-xlarge\" type=\"text\" placeholder=\"Enter Your Email\"/><button id=\"csp3-subscribe-btn\" type=\"submit\" class=\"btn btn-large action\">Go For It</button></div></div></form>

\t\t\t\t\t<div id=\"csp3-social-profiles\"></ div>

\t\t\t\t</div><!-- end of #csp3-content -->

\t\t\t</div><!--! end of .span8 -->

\t\t</div> <!--! end of .row -->

\t</div> <!--! end of .container -->

\t



<!-- Belatedpng -->

<!--[if lt IE 7 ]>

<script src=\"http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/dd_belatedpng.js\"></script>

<script>DD_belatedPNG.fix(’img, .png_bg’);</script>

<![endif]-->

<!-- Email Form Strings -->

<script>

\tvar seed_csp3_err_msg={

\t\t’msgdefault’:’Enter Your Email’,

\t\t’msg600’:’Guess what! You&#039;re already subscribed :)’,

\t\t’msg500’:’Error, please try again.’,

\t\t’msg400’:’Please enter a valid email.’,

\t\t’msg200’:’You&#039;ll be notified soon!’

\t};

\t</script><script>

jQuery(document).ready(function(

('#tipsy').tipsy({fade: true, gravity: 's'});
});
</script><!--[if IE]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->


<div class="wrapper">
<img alt="YourLogo" src="http://upagge.com/images/logo.png" title="We got all you translation and localization needs covered!" />

<div class="hr">
</div>

<h1>
Wait for it... wait for it...</h1>

<p>
It seems like we came up with another awesome idea and need some time to implement it. Stay tuned!</p>
<section class="progress">

<div class="progress-bar-container" id="tipsy" title="65% Complete">
<article class="progress-bar" style="width:65%"></article></div>

<article class="txt-launch-day-hat"></article>

</section>

<blockquote>
</blockquote>
<p align="left">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp; We Love Being Followed:</p>
<blockquote>
</blockquote>
<br />

<div align="left">
<a href="https://twitter.com/WeLoveTRAN" target="_blank"><img alt="" src="http://welovetranslating.com/welcome/wp-content/uploads/2013/08/twitter-red-check-circle-social-media-icon.png" border="0" width="100" /></a><a href="http://www.linkedin.com/in/welovetranslating" target="_blank"><img alt="" src="http://welovetranslating.com/welcome/wp-content/uploads/2013/08/linkeden-red-check-circle-social-media-icon.png" border="0" width="100" /></a><a href="https://www.facebook.com/dmitry.kornyukhov" target="_blank"><img alt="" src="http://welovetranslating.com/welcome/wp-content/uploads/2013/08/Facebook-red-check-circle-social-media-icon.png" border="0" width="100" /></a></div></div>

And I would like to add the signup form at the bottom of my page (in the middle, right next to the social network icons.) But I have no idea how to do it and would appreciate any tips or suggestions. If you can help me I would be really grateful.

The code for signup form is given bellow:

<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js ie6 oldie" lang="en"> <![endif]-->
<!--[if IE 7]> <html class="no-js ie7 oldie" lang="en"> <![endif]-->
<!--[if IE 8]> <html class="no-js ie8 oldie" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Website Localization and Translation | We Love Translating</title>
<meta name="description" content="Welcome to We Love Translating - the ultimate provider for all your translation and localization needs.">
<meta name="viewport" content="width=device-width, initial-scale=1.0">


<!-- Google Fonts CSS -->
<link href='//fonts.googleapis.com/css?family=Pontano+Sans' rel='stylesheet' type='text/css'>
<link href='//fonts.googleapis.com/css?family=Bevan' rel='stylesheet' type='text/css'>
<!-- Bootstrap and default Style -->
<link rel="stylesheet" href="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap.min.css">
<link rel="stylesheet" href="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/css/bootstrap-responsive.min.css">
<link rel="stylesheet" href="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/style.css">
<style type="text/css">
/* calculated styles */
.progress-striped .bar, .progress.active .bar{background-color:#E85C41}.progress .bar {
background-color: #da4c31;
background-image: -moz-linear-gradient(top,#E85C41,#c53418);
background-image: -ms-linear-gradient(top,#E85C41,#c53418);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#E85C41),to(#c53418));
background-image: -webkit-linear-gradient(top,#E85C41,#c53418);
background-image: -o-linear-gradient(top,#E85C41,#c53418);
background-image: linear-gradient(top,#E85C41,#c53418);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e85c41', endColorstr='#c53418', GradientType=0);
}
.countdown_section {
background-color: #da4c31;
background-image: -moz-linear-gradient(top,#E85C41,#c53418);
background-image: -ms-linear-gradient(top,#E85C41,#c53418);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#E85C41),to(#c53418));
background-image: -webkit-linear-gradient(top,#E85C41,#c53418);
background-image: -o-linear-gradient(top,#E85C41,#c53418);
background-image: linear-gradient(top,#E85C41,#c53418);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e85c41', endColorstr='#c53418', GradientType=0);
}

/* Background Style */
html{
height:100%;
background: #ffffff;
}
body{
height:100%;
background: transparent;
}

/* Text Styles */
body{
font-family: 'Pontano Sans';
}


h1, h2, h3, h4, h5, h6{
font-family: 'Bevan';;
font-weight:normal;
}

button{
font-family: 'Bevan'; }

body{
color:#999999;
}



h1, h2, h3, h4, h5, h6{
color:#444444;
}


a, a:visited, a:hover, a:active{
color:#E85C41;
}

.btn,
.gform_button {
color: white;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
background-color: #da4c31;
background-image: -moz-linear-gradient(top,#E85C41,#c53418);
background-image: -ms-linear-gradient(top,#E85C41,#c53418);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#E85C41),to(#c53418));
background-image: -webkit-linear-gradient(top,#E85C41,#c53418);
background-image: -o-linear-gradient(top,#E85C41,#c53418);
background-image: linear-gradient(top,#E85C41,#c53418);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#e85c41', endColorstr='#c53418', GradientType=0);
border-color: #c53418 #c53418 #802210;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
*background-color: #c53418;
filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}
.btn:hover,
.btn:active,
.btn.active,
.btn.disabled,
.btn[disabled],
.gform_button:hover,
.gform_button:active,
.gform_button.active,
.gform_button.disabled,
.gform_button[disabled] {
background-color: #c53418;
*background-color: #ae2e15;
}
.btn:active,
.btn.active,
.gform_button:active,
.gform_button.active {
background-color: #972812 \9;
}
#csp3-progressbar span,
.countdown_section {
color: white;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
.btn:hover {
color: white;
text-shadow: 0 -1px 0 rgba(0,0,0,0.3);
}
input[type='text'] {
border-color: #c53418 #c53418 #802210;
}
input[type='text']:focus {
border-color: rgba(195,53,24,0.8);
webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(195,53,24,0.6);
-moz-box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(195,53,24,0.6);
box-shadow: inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(195,53,24,0.6);
}

/* Landscape phones and down */
@media (max-width: 480px) {
#csp3-email{
margin-bottom: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
#csp3-email,#csp3-fname,#csp3-lname{
width:97% !important;
}
#csp3-fname{
margin-right:0;
}
#csp3-subscribe-btn{
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}
.csp3-form-wrapper {
text-align:left;
}

#csp3-content {
padding: 15px;
margin-top: 20px;
}
.input-append{
display:block !important;
}
html{
height:auto;
}

#csp3-email{
margin-bottom: 10px;
}
#csp3-headline {
line-height: 46px;
}
.countdown_section{
margin-bottom: 10px;
}

}

/* Landscape phone to portrait tablet */
@media (max-width: 767px) {
#csp3-fname,
#csp3-lname{
box-sizing:inherit;
width:90%;
}
#csp3-email{
box-sizing:inherit;
width:90%;
}

#csp3-subscribe-btn{
display:block;
}

#csp3-subscribe-btn{
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
}

#csp3-email{
margin-bottom: 10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

#csp3-fname,#csp3-fname{
margin-bottom: 10px
}

.input-append{
display:block !important;
}

#csp3-email,#csp3-subscribe-btn{
margin:auto;
}

#csp3-email{
margin-bottom:10px;
}

}

/* Portrait tablet to landscape and desktop */
@media (min-width: 768px) and (max-width: 979px) { }

/* Large desktop */
@media (min-width: 1200px) { }

</style>
<!-- JS -->
<script src="http://welovetranslating.com/welcome/wp-includes/js/jquery/jquery.js"></script>
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/bootstrap/js/bootstrap.js"></script>
<!-- FitVid -->
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/jquery.fitvids.js"></script>
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/script.js"></script>
<!-- Google Analytics -->
<script type='text/javascript'>

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-43649157-1']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script><!-- Modernizr -->
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/modernizr.min.js"></script>


</head>
<body>
<div class="container">
<div class="row">
<div class="span10 offset1">
<div id="csp3-content">




<div id="csp3-description"><p>Let&#8217;s stay in touch! Get the latest news and exclusive offers!</p>
</div>
<form id="csp3-form" class="form-inline" method="post"><input id="csp3-ref" name="ref" type="hidden" value="" /><input id="csp3-ajax-url" type="hidden" value="http://welovetranslating.com/welcome/wp-admin/admin-ajax.php" /><div id="csp3-alert" class="alert"></div><div class="csp3-form-wrapper"><input id="csp3-fname" name="fname" class="input-medium" type="text" placeholder="First Name"/><input id="csp3-lname" name="lname" class="input-large" type="text" placeholder="Last Name"/><span class="sep"></span><div class="input-append"><input id="csp3-email" name="email" class="input-xlarge" type="text" placeholder="Enter Your Email"/><button id="csp3-subscribe-btn" type="submit" class="btn btn-large action">Go For It</button></div></div></form>
<div id="csp3-social-profiles"></div>
</div><!-- end of #csp3-content -->
</div><!--! end of .span8 -->
</div> <!--! end of .row -->
</div> <!--! end of .container -->


<!-- Belatedpng -->
<!--[if lt IE 7 ]>
<script src="http://welovetranslating.com/welcome/wp-content/plugins/seedprod-coming-soon-pro/themes/default/js/dd_belatedpng.js"></script>
<script>DD_belatedPNG.fix('img, .png_bg');</script>
<![endif]-->
<!-- Email Form Strings -->
<script>
var seed_csp3_err_msg={
'msgdefault':'Enter Your Email',
'msg600':'Guess what! You&#039;re already subscribed :)',
'msg500':'Error, please try again.',
'msg400':'Please enter a valid email.',
'msg200':'You&#039;ll be notified soon!'
};
</script><script>
jQuery(document).ready(function(

){

这篇关于在页面底部放置一个注册表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！