htmlコード
<ヘッダ>
<DIV CLASS = "NAV">
<スパンクラス= "クローズ-BTN"> </スパン>
の<a href="" class="register-btn">注册</a>の
</ div>
<H1 >欢迎登录平安官网</ H1>
</ヘッダ>
<DIV CLASS = "ログイン-タブ">
<ulのクラス= "タブ">
<LIクラス= "NO"> SMSの検証コードでのログイン</ LI>
<LI>アカウントのパスワード</ LI>
</ UL>
<UL =クラス"タブ-コンテンツ">
<LI>
<DIV CLASS = "TEL入力項目-項目">
<入力クラス= "TEL"プレースホルダ= "電話番号/ユーザー名/ IDを入力してください。">
<スパン> < /スパン>
</ div>
<divのクラス= "入力-商品コード-項目">
<タイプの入力は= "テキスト"クラス= "TEL"プレースホルダ= "あなたのパスワードを入力してください">
<Buttonクラス= "コード-BTN">パスワードを忘れましたか？</ボタン>
</ div>
</ LI>
</ UL>
<DIV CLASS = "ログイン">
<TYPE = "text"の値は= "ログイン"のボタン>ログイン</ボタン>
</ div>
<p型クラス= "ヒント">記号は、あなたが持っていることを意味し一致します
<a href="https://member.pingan.com.cn/pinganone/pa/paoasp.screen">「プライバシーポリシーおよびサービスの利用規約」</a>に
</ p型>
</ div>
CSSコード
* {
パディング：0;
マージン：0;
テキスト装飾：なし;
リストスタイル：なし。
}
ヘッダ{
表示ブロック;
高さ：10rem。
パディングトップ：.2rem。
背景サイズ：100％100％。
背景色：＃FF8040の。
}
.nav {
表示：-webkit-ボックス。
表示：-ms-フレキシボックス。
表示：フレックス。
-webkit-ボックス整列：センター;
-ms-フレックス整列：センター;
ALIGN-アイテム：センター;
-webkit-箱パック：正当化。
-ms-フレックスパック：正当化。
-コンテンツが正当化：スペースの間;
高さ：.48rem。
パディング：0 .4rem。
}
.register-BTN {
表示ブロック;
幅：1.88rem。
高さ：0.48rem。
行の高さ：0.48rem。
国境：1pxの固体#FFF;
国境半径：2ピクセル。
テキスト整列：センター;
色：#FFF;
フォントサイズ：.28rem。
マージントップ：1rem。
パディング：0.4rem 0;
}
H1 {
マージン：30px 0;
パディング：2rem 1.56rem。
フォントサイズ：2rem。
色：#FFF;
}
.loginファイルタブ{
マージントップ：2.32rem。
背景：#FFF;
}
。タブ{
表示：フレックス。
高さ：3rem。
パディング：0 .4rem。
border-bottom：1pxの固体#ddd。
}
.but {
位置：相対;
-webkit-ボックスフレックス：1;
フレックス：1;
高さ：1rem。
行の高さ：1rem。
マージン：0 .4rem。
テキスト整列：センター;
フォントサイズ：1.32rem。
-webkit-タップハイライトカラー：透明;
色：＃ff6633と、
}
.TAB .NO :: {後
コンテンツ：'';
表示ブロック;
位置：絶対;
左：0;
下：-1px;
幅：100％;
高さ：2ピクセル。
背景：＃f05a23。
トップ：48px;
}
.TAB含有率のLi {
マージン：3.5rem 0 0 2.5rem。
}
.input項目{
ボックスサイズ：ボーダーボックス;
表示：フレックス。
-webkit-ボックス整列：センター;
ALIGN-アイテム：センター;
border-bottom：1pxの固体#ddd。
マージン右：2.3rem。
}
.input項目入力{
-webkit-外観：なし。
マージン：計6Px。
国境：なし;
概要：なし。
-webkit-ボックスフレックス：1;
フレックス：1;
パディング：0.5rem .14rem。
フォントサイズ：.9rem。
色：＃171717;
マージントップ：1rem。
}
.input項目：最初の子{
マージン下：2.26rem。
}
.CODE-BTN {
マージン：0 1.4rem 0 0;
色：＃ff8028と、
フォントサイズ：18px;
国境：なし;
背景：#FFF;
}
。ログイン{
パディング：40ピクセル;
}
.loginファイルボタン{
表示ブロック;
マージン：0自動;
幅：20rem。
高さ：3rem。
ボーダー：0;
背景：＃ff8028と、
色：#FFF;
フォントサイズ：18px;
}
.tips {
マージントップ：.38rem。
テキスト整列：センター;
色：＃616161;
フォントサイズ：0.8rem。
}
PC側のページ
モバイルページを終了
