本文介绍了如何让此表单元素位于此页面的中心?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

HTML code



HTML code

<form method="post" id= "form" action>
        <input type="text" id="email" name="email" value class="defaultText">
        <input type="submit" value="submit" id="submitButton">
</form>





CSS代码



* {

保证金:0 ;

p



CSS code

*{
margin:0;
p

<pre lang="CSS"><pre lang="c++"><pre lang="CSS">

添加:0;

}





/ * -------------------------

一般样式

-------------------------- * /





html {

背景:#b0b0b0;

}



身体{

背景:#ffff68f无重复中心;

字体:14px / 1.3'Segoe UI',Arial,sans-serif;

}





表格{

背景:#181819;

显示:块;

身高:31px;

填充:10px;

职位:相对;

宽度:323px;

-webkit-border-radius:3px;
-moz-border-radius:3px;

border-radius:3px;

}



#form {

颜色:rgb(238,238,238);

身高:31px;

职位:相对;

宽度:323px;

perspective-origin:171.5px 25.5px;

transform-origin:171.5px 25.5px;

背景:rgba(24,24,25)无重复滚动0%0%/ auto padding-box border-box;

border:0px none rgb(238,238,238) );

border-radius:3px 3px 3px 3px;

字体:正常正常正常15px /正常校准Arial sans-serif;

保证金:0px 0px 0px -7px;

填充:10px;

}



#submitButton {

background:url(submit_form.png)no-repeat right top;

border:none;

cursor:pointer;

身高:31px;

左:236px;

行高:31px;

职位:绝对;

text-indent:-99999px;

text-transform:uppercase;

top:10px;

宽度:96px;

}



#email {

background:url(submit_form.png)no-repeat;

border:none;

color: #888888;

身高:31px;

左:10px;

行高:31px;

填充-left:8px;

text-shadow:1px 1px 0#000000;

top:10px;

宽度:215px;

outline:none;

}

adding:0;
}


/*-------------------------
General Styles
--------------------------*/


html{
background: #b0b0b0;
}

body {
background: #fff68f no-repeat center center;
font:14px/1.3 'Segoe UI',Arial, sans-serif;
}


form {
background: #181819;
display: block;
height: 31px;
padding: 10px;
position: relative;
width: 323px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
}

#form {
color: rgb(238, 238, 238);
height: 31px;
position: relative;
width: 323px;
perspective-origin: 171.5px 25.5px;
transform-origin: 171.5px 25.5px;
background: rgba(24, 24, 25) none repeat scroll 0% 0% / auto padding-box border-box;
border: 0px none rgb(238, 238, 238);
border-radius: 3px 3px 3px 3px;
font: normal normal normal normal 15px/normal calibri Arial sans-serif;
margin: 0px 0px 0px -7px;
padding: 10px;
}

#submitButton {
background: url(submit_form.png) no-repeat right top;
border: none;
cursor: pointer;
height: 31px;
left: 236px;
line-height: 31px;
position: absolute;
text-indent: -99999px;
text-transform: uppercase;
top: 10px;
width: 96px;
}

#email {
background: url(submit_form.png) no-repeat;
border: none;
color: #888888;
height: 31px;
left: 10px;
line-height: 31px;
padding-left: 8px;
text-shadow: 1px 1px 0 #000000;
top: 10px;
width: 215px;
outline: none;
}

推荐答案

form {
margin: 0 auto;
width:250px;
}


form {
  display: inline-block;
  text-align: center;
}



这篇关于如何让此表单元素位于此页面的中心?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-22 22:14