小編給大家分享一下css如何制作一個登陸表單，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！
創(chuàng)新互聯(lián)公司擁有10余年的建站服務(wù)經(jīng)驗，在此期間，我們發(fā)現(xiàn)較多的客戶在挑選建站服務(wù)商前都非常的猶豫。主要問題集中：在無法預(yù)知自己的網(wǎng)站呈現(xiàn)的效果是什么樣的？也無法判斷選擇的服務(wù)商設(shè)計出來的網(wǎng)頁效果自己是否會滿意？創(chuàng)新互聯(lián)公司業(yè)務(wù)涵蓋了互聯(lián)網(wǎng)平臺網(wǎng)站建設(shè)、移動平臺網(wǎng)站制作、網(wǎng)絡(luò)推廣、按需定制設(shè)計等服務(wù)。創(chuàng)新互聯(lián)公司網(wǎng)站開發(fā)公司本著不拘一格的網(wǎng)站視覺設(shè)計和網(wǎng)站開發(fā)技術(shù)相結(jié)合，為企業(yè)做網(wǎng)站提供成熟的網(wǎng)站設(shè)計方案。
HTML結(jié)構(gòu)：
CSS代碼：
body,ul{
margin:0;
padding:0
}
a{
color:rgb（1,124,185）；
text-decoration:none;
}
input:focus{
outline:none0;
}
body{
color:#b5b5b5;
font:14px'Arial';
}
body,
li:first-child:after,
li:last-child:after{
background-image:url（data:image/png;base64,…）；/**/
}
.box{
position:relative;
width:384px;
height:140px;
margin:50pxauto;
}
.boxli{
list-style-type:none;
margin-bottom:10px;
border-radius:5px;
overflow:hidden;
position:relative;
height:42px;
}
.boxliinput{
box-shadow:inset005pxrgba（0,0,0,.5），-1px1px0rgba（255,255,255,.05）；
border:0none;
padding:8px5px5px;
border-radius:5px;
width:300px;
height:28px;
-webkit-box-sizing:content-box;
-moz-box-sizing:content-box;
-o-box-sizing:content-box;
-ms-box-sizing:content-box;
box-sizing:content-box;
background:rgba（0,0,0,.1）；
color:#fff;
}
.boxli:first-child:after,
.boxli:last-child:after{
position:absolute;
width:50px;
height:50px;
content:"";
border-radius:25px;
z-index:2;
right:-23px;
box-shadow:008pxrgba（0,0,0,.5）；
}
::-webkit-input-placeholder{
color:#fff;
font-weight:bold;
}
.boxli:first-child:after{
top:15px;
}
.boxli:last-child:after{
bottom:15px;
}
.boxlabel{
width:70px;
display:inline-block;
text-align:right;
}
.boxspan{
display:block;
color:#6296b4;
padding-left:75px;
}
.button{
position:absolute;
top:24px;
right:-30px;
width:44px;
height:44px;
border-radius:22px;
border:1pxsolid#00a1d2;
background:-webkit-linear-gradient（top,#029ecd,#0d7796）；
color:#fff;
text-shadow:1px1px0#666;
box-shadow:0005px#2c2c2c;
z-index:3;
text-align:center;
line-height:46px;
-webkit-transition:all0.28sease-in;
-moz--transition:all0.28sease-in;
}
.button:hover{
-webkit-transform:rotate（90deg）；
}
@font-face{
font-family:'FontAwesome';
src:url（'font/fontawesome-webfont.eot'）；
src:url（'font/fontawesome-webfont.eot?#iefix'）format（'embedded-opentype'），
url（'font/fontawesome-webfont.woff'）format（'woff'），
url（'font/fontawesome-webfont.ttf'）format（'truetype'），
url（'font/fontawesome-webfont.svg#FontAwesome'）format（'svg'）；
font-weight:normal;
font-style:normal;
}
.icon-arrow-right:before{
font-family:FontAwesome;
font-weight:normal;
font-size:26px;
font-style:normal;
display:inline-block;
text-decoration:inherit;
content:"\f061";
}
以上是“css如何制作一個登陸表單”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對大家有所幫助，如果還想學(xué)習(xí)更多知識，歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道！
重慶分公司
重慶分公司
