"text/html; charset =utf-8" />
ajax.googleapis.com/ ajax/libs/jquery/1.7.1/jquery.min.js">
< ;/body>
🎜>
Salin kod
Kod tersebut adalah seperti berikut:
badan{ latar belakang:url(bg.jpg) ulang; font-family:Arial Narrow, Arial, sans-serif; margin:0; pelapis:0; } pengepala, bahagian, pengaki{ paparan:blok; } pengepala{ lebar:100%; warna latar belakang:rgb(0, 0, 0); warna latar belakang:rgba(0, 0, 0, 0.9); warna:#ccc; lapik:15px 0; jarak huruf:1px; margin-bawah:20px; kedudukan:saudara; } pengepala h1{ margin:0 50px; bayang-teks:2px 2px 2px #888; apung:kiri; } #pautan balik{ float:kanan; margin:-10px 20px; garis-tinggi:25px; berat fon:tebal; saiz fon:12px; text-align:right; } #pautan balik a{ warna:#ccc; teks-hiasan:tiada; margin:3px 0 0; paparan:sekat; } #pautan balik a:hover{ warna:#fff; } pengaki{ warna latar:rgb(0, 0, 0); warna latar belakang:rgba(0, 0, 0, 0.8); tinggi:25px; lebar:100%; garis-tinggi:25px; kedudukan:saudara; font-family:Arial,Helvetica,sans-serif; bawah:0; kiri:0; warna:#888; saiz fon:11px; } jarak pengaki{ padding-kiri:20px; } pengaki a{ warna:#1FA2E1; } #pembungkus{ lebar:770px; margin:0 auto; text-align:center; } #pembungkus hgroup{ margin:20px 0; bayang-teks:1px 1px 1px #ccc; } #pembungkus h1{ warna:#146FA0; saiz fon:42px; margin:0; } #pembungkus h2{ warna:#71C1ED; saiz fon:27px; margin:0; } #lbl{ warna:#777; saiz fon:17px; berat fon:tebal; bayang-teks:1px 1px 0 #fff; margin:10px 0; } *:fokus{ garis besar:tiada; } label, input, kawasan teks, set medan{ paparan:blok; } set medan#akaun, set medan#peribadi{ lebar:250px; lapik:0 50px 50px; margin:10px; apung:kiri; latar belakang:rgb(244,244,244); latar belakang:rgba(244,244,244,0.7); -webkit-border-radius: 25px; -moz-border-radius: 25px; jejari sempadan: 25px; sempadan:3px ganda #999; } fieldset#confirm{ padding-top:10px; jelas:keduanya; sempadan:tiada; garis-tinggi:15px; margin:10px 0; } set medan#sahkan label, set medan#sahkan input{ paparan:sebaris; apung:kiri; margin:15px 5px 0; } legenda{ saiz fon:20px; berat fon:tebal; jarak huruf:5px; warna:#999; margin-kiri:-20px; text-align:left; lapik:0 10px; bayang-teks:1px 1px 0 #ccc; } label{ saiz fon:17px; berat fon:tebal; margin:17px 0 7px; text-align:left; bayang-teks:1px 1px 0 #fff; } kawasan teks{ saiz semula:kedua-duanya; lebar maksimum:230px; } input.textbox, textarea{ padding:5px 10px; -webkit-border-radius: 15px; -jejari-sempadan-moz: 15px; jejari sempadan: 15px; sempadan:1px pepejal #fff; lebar:200px; bayang-teks:1px 1px 1px #777; -moz-box-shadow: 0px 2px 0px #999; -webkit-box-shadow: 0px 2px 0px #999; bayang kotak: 0px 2px 0px #999; -webkit-transition: semua 0.5s kemudahan-keluar; -moz-transition: semua 0.5s kemudahan-keluar; peralihan: semua 0.5s mudah masuk; latar belakang:url(diperlukan.png) tiada ulangan 200px 5px #F0F0EF; latar belakang:-webkit-gradient(linear, kiri atas, kiri bawah, dari(#E3E3E3), hingga(#FFFFFF)); /* Saf4 , Chrome */ latar belakang:-webkit-linear-gradient(atas, #E3E3E3, #FFFFFF); /* Chrome 10 , Saf5.1 */ latar belakang:-moz-linear-gradient(atas, #E3E3E3, #FFFFFF); /* FF3.6 */ latar belakang:-ms-linear-gradient(atas, #E3E3E3, #FFFFFF); /* IE10 */ latar belakang:-o-linear-gradient(atas, #E3E3E3, #FFFFFF); /* Opera 11.10 */ } input.textbox:focus, textarea:focus{ -webkit-transform: scale(1.1); -moz-transform: skala(1.1); transformasi: skala(1.1); -moz-box-shadow: 5px 3px 1px #ccc; -webkit-box-shadow: 5px 3px 1px #ccc; bayang kotak: 7px 7px 2px #ccc; bayang-teks:1px 1px 3px #777; } input.textbox:required{ background:url(required.png) no-repeat 200px 5px #F0F0EF; latar belakang:url(required.png) tiada ulangan 200px 5px, -webkit-gradient(linear, kiri atas, kiri bawah, dari(#E3E3E3), hingga(#FFFFFF)); /* Saf4 , Chrome */ background:url(required.png) no-repeat 200px 5px, -webkit-linear-gradient(top, #E3E3E3, #FFFFFF); /* Chrome 10 , Saf5.1 */ background:url(required.png) no-repeat 200px 5px, -moz-linear-gradient(top, #E3E3E3, #FFFFFF); /* FF3.6 */ latar belakang:url(diperlukan.png) tiada ulangan 200px 5px, -ms-linear-gradient(atas, #E3E3E3, #FFFFFF); /* IE10 */ latar belakang:url(diperlukan.png) tiada ulangan 200px 5px, -o-linear-gradient(atas, #E3E3E3, #FFFFFF); /* Opera 11.10 */ } input.textbox:required:valid{ background:url(valid.png) no-repeat 200px 5px #F0F0EF; latar belakang:url(sah.png) tiada ulangan 200px 5px, -webkit-gradient(linear, kiri atas, kiri bawah, dari(#E3E3E3), hingga(#FFFFFF)); /* Saf4 , Chrome */ background:url(valid.png) tiada ulangan 200px 5px, -webkit-linear-gradient(atas, #E3E3E3, #FFFFFF); /* Chrome 10 , Saf5.1 */ background:url(valid.png) tiada ulangan 200px 5px, -moz-linear-gradient(atas, #E3E3E3, #FFFFFF); /* FF3.6 */ latar belakang:url(sah.png) tiada ulangan 200px 5px, -ms-linear-gradient(atas, #E3E3E3, #FFFFFF); /* IE10 */ latar belakang:url(sah.png) tiada ulangan 200px 5px, -o-linear-gradient(atas, #E3E3E3, #FFFFFF); /* Opera 11.10 */ } input.textbox:focus:invalid, input.textbox:not(:required):invalid{ background:url(invalid.png) no-repeat 200px 5px # F0F0EF; latar belakang:url(invalid.png) tiada ulangan 200px 5px, -webkit-gradient(linear, kiri atas, kiri bawah, dari(#E3E3E3), hingga(#FFFFFF)); /* Saf4 , Chrome */ background:url(invalid.png) no-repeat 200px 5px, -webkit-linear-gradient(top, #E3E3E3, #FFFFFF); /* Chrome 10 , Saf5.1 */ background:url(invalid.png) tiada ulangan 200px 5px, -moz-linear-gradient(atas, #E3E3E3, #FFFFFF); /* FF3.6 */ latar belakang:url(invalid.png) tiada ulangan 200px 5px, -ms-linear-gradient(atas, #E3E3E3, #FFFFFF); /* IE10 */ latar belakang:url(invalid.png) tiada ulangan 200px 5px, -o-linear-gradient(atas, #E3E3E3, #FFFFFF); /* Opera 11.10 */ } input[type=submit] { padding:10px; margin:0 10px !penting; lebar:300px; } @skrin media dan (-webkit-min-device-pixel-ratio:0) { input[type=range] {padding:0;} } #rangevalue { paparan:sekat; text-align:right; margin atas:-25px; } input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { warna: #aaa; gaya fon:italic; bayang-teks:1px 1px 0 #fff; } input:-moz-placeholder, textarea:-moz-placeholder { color: #aaa; gaya fon:italic; bayang-teks:1px 1px 0 #fff; } .jelaskan{ jelas:kedua-duanya; }