ShareCode đăng nhập giống facebook

1 bài đăng
07.02.2017 / 19:05
HackerPro
Bài đăng: 220
Member
123baylenuocmo's
HTML5
  1. <div class="b c d e f">
  2. <div class="g">
  3. <div id="viewport">
  4. <div class="h i" id="header">
  5. <table cellspacing="0" cellpadding="0" class="j">
  6. <tr>
  7. <td valign="middle">
  8. <h1><img src="https://static.xx.fbcdn.net/rsrc.php/v3/y8/r/k97pj8-or6s.png" width="77" height="16" class="k" alt="facebook" /></h1>
  9. </td>
  10. <td valign="middle" class="l"><a class="m n o p" href="/reg/?cid=102&amp;refid=8" style="background-color:#69a74e;color:white;"><span class="q">Tạo tài khoản</span></a>
  11. </td>
  12. </tr>
  13. </table>
  14. </div>
  15. <div id="objects_container">
  16. <div class="f" id="root" role="main">
  17. <table class="s" role="presentation">
  18. <tbody>
  19. <tr>
  20. <td class="t">
  21. <div class="u v w" style="display: none;">
  22. <div class="x"></div>
  23. </div>
  24. <div>
  25. <div class="y z">
  26. <div></div>
  27. <form method="post" class="ba" id="login_form" novalidate="1" action="https://m.facebook.com/login.php?refsrc=https%3A%2F%2Fm.facebook.com%2Fhaivl.com%2Fphotos%2Fa.384077014974098.86259.383923618322771%2F1988681994513584%2F&amp;lwv=100&amp;login_try_number=1&amp;refid=8">
  28. <input type="hidden" name="lsd" value="AVrQCoSQ" autocomplete="off" />
  29. <input type="hidden" name="version" value="1" />
  30. <input type="hidden" id="ajax" name="ajax" value="0" />
  31. <input type="hidden" id="width" name="width" value="0" />
  32. <input type="hidden" id="pxr" name="pxr" value="0" />
  33. <input type="hidden" id="gps" name="gps" value="0" />
  34. <input type="hidden" id="dimensions" name="dimensions" value="0" />
  35. <input type="hidden" name="m_ts" value="1486467491" />
  36. <input type="hidden" name="li" value="o7GZWNFhbG2ahGAuPIBjNZQt" />
  37. <ul class="bb bc bd">
  38. <li class="bc">
  39. <h3 class="be bf bg">Email hoặc số điện thoại</h3>
  40. <input autocorrect="off" autocapitalize="off" class="bh bi bj" name="email" value="" type="text" />
  41. </li>
  42. <li class="bc">
  43. <div>
  44. <h3 class="be bf bg">Mật khẩu</h3>
  45. <input autocorrect="off" autocapitalize="off" class="bh bi bk bl" name="pass" type="password" />
  46. </div>
  47. </li>
  48. <li class="bc">
  49. <input value="&#x110;&#x103;ng nh&#x1ead;p" type="submit" name="login" class="m n bm bn bo" />
  50. </li>
  51. </ul>
  52. <div></div>
  53. <noscript>
  54. <input type="hidden" name="_fb_noscript" value="true" />
  55. </noscript>
  56. </form>
  57. <div class="bp"><span class="bq">hoặc</span>
  58. </div>
  59. <div class="br bs">
  60. <div class="br bt" id="signup-button"><a class="m n bu" href="/reg/?cid=103&amp;refid=8" style="
  61. background-color:#69a74e;
  62. color:white;
  63. height:44px;"><span class="q">Tạo tài khoản mới</span></a>
  64. </div>
  65. </div>
  66.  
  67. </div>
  68. </div>
  69. </td>
  70. </tr>
  71. </tbody>
  72. </table>
  73. <div></div>
  74. </div>
  75. </div>
  76. <div></div>
  77. </div>
  78. </div>
  79. </div>

CSS
  1. .b .bj {
  2. border: solid 1px #999;
  3. box-sizing: border-box;
  4. width: 100%;
  5. }
  6. .b .bt {
  7. display: block;
  8. width: auto;
  9. }
  10. .b .bp {
  11. display: block;
  12. margin-bottom: 5px;
  13. margin-left: 3%;
  14. margin-top: -3px;
  15. overflow: hidden;
  16. text-align: center;
  17. white-space: nowrap;
  18. width: 94%;
  19. }
  20. .b .bp>span {
  21. display: inline-block;
  22. position: relative;
  23. }
  24. .b .bp>span:before,
  25. .b .bp>span:after {
  26. background: #ced0d4;
  27. content: "";
  28. height: 1px;
  29. position: absolute;
  30. top: 50%;
  31. width: 9999px;
  32. }
  33. .b .bp>span:before {
  34. margin-right: 15px;
  35. right: 100%;
  36. }
  37. .b .bp>span:after {
  38. left: 100%;
  39. margin-left: 15px;
  40. }
  41. .b .bq {
  42. color: #4b4f56;
  43. font-size: 14px;
  44. }
  45. .v {
  46. padding: 8px;
  47. }
  48. .bw {
  49. padding-bottom: 12px;
  50. padding-top: 12px;
  51. }
  52. .bv {
  53. padding-left: 4px;
  54. padding-right: 4px;
  55. }
  56. .bs {
  57. padding-left: 8px;
  58. padding-right: 8px;
  59. }
  60. .bg {
  61. padding-bottom: 4px;
  62. }
  63. .b .s {
  64. border: 0;
  65. border-collapse: collapse;
  66. margin: 0;
  67. padding: 0;
  68. width: 100%;
  69. }
  70. .b .s tbody {
  71. vertical-align: top;
  72. }
  73. .b .s td {
  74. padding: 0;
  75. }
  76. .b .s td.bc {
  77. padding: 4px;
  78. }
  79. .b .t {
  80. width: 100%;
  81. }
  82. .u {
  83. background: #fa3e3e;
  84. }
  85. .w {
  86. color: #fff;
  87. }
  88. .b .w a,
  89. .b .w a:visited {
  90. color: #fff;
  91. font-weight: bold;
  92. }
  93. .b .w a:focus,
  94. .b .w a:hover {
  95. background: #1d2129;
  96. }
  97. .by {
  98. color: #4b4f56;
  99. }
  100. .x {
  101. font-size: 12px;
  102. line-height: 16px;
  103. }
  104. .bx {
  105. font-size: 16px;
  106. line-height: 20px;
  107. }
  108. .be {
  109. font-weight: bold;
  110. }
  111. .br {
  112. text-align: center;
  113. }
  114. form {
  115. margin: 0;
  116. border: 0;
  117. }
  118. .bb {
  119. margin: 0;
  120. }
  121. .bb li {
  122. display: block;
  123. list-style: none;
  124. }
  125. .b .bz {
  126. padding: 0;
  127. }
  128. .b .bc {
  129. padding: 4px;
  130. }
  131. .b .bf {
  132. color: #90949c;
  133. font-weight: bold;
  134. }
  135. .b .bi {
  136. padding: 12px 8px;
  137. color: #1d2129;
  138. }
  139. .bh {
  140. border: 0;
  141. display: block;
  142. margin: 0;
  143. padding: 0;
  144. }
  145. .bk {
  146. box-sizing: border-box;
  147. width: 100%;
  148. }
  149. .b .bl {
  150. border: solid 1px #999;
  151. }
  152. .b a,
  153. .b a:visited {
  154. color: #3b5998;
  155. text-decoration: none;
  156. }
  157. .b a:focus,
  158. .b a:hover {
  159. background-color: #3b5998;
  160. color: #fff;
  161. }
  162. .n {
  163. -webkit-appearance: none;
  164. background: none;
  165. display: inline-block;
  166. font-size: 12px;
  167. height: 28px;
  168. line-height: 28px;
  169. margin: 0;
  170. overflow: visible;
  171. padding: 0 9px;
  172. text-align: center;
  173. vertical-align: top;
  174. white-space: nowrap;
  175. }
  176. .b .n {
  177. border-radius: 2px;
  178. }
  179. .bu,
  180. a.bu,
  181. .b a.bu,
  182. .b a.bu:visited {
  183. background-color: #f6f7f9;
  184. color: #4b4f56;
  185. }
  186. .b a.bu:hover,
  187. .b .bu:hover {
  188. background-color: #e9ebee;
  189. color: #4b4f56;
  190. }
  191. .b .bu {
  192. border: 1px solid #bec2c9;
  193. }
  194. .bu[disabled] {
  195. color: #bec2c9;
  196. }
  197. .b .bu[disabled]:hover {
  198. background-color: #f6f7f9;
  199. color: #bec2c9;
  200. }
  201. .bo,
  202. .p,
  203. a.bo,
  204. a.p,
  205. html .b a.bo,
  206. html .b a.p {
  207. color: #fff;
  208. }
  209. .b .p {
  210. background-color: #4080ff;
  211. border: 1px solid #4476e8;
  212. }
  213. .b a.p:hover,
  214. .b .p:hover {
  215. background-color: #4580ef;
  216. }
  217. .b .bo {
  218. background-color: #4267b2;
  219. border: 1px solid #365899;
  220. }
  221. .b a.bo:hover,
  222. .b .bo:hover {
  223. background-color: #465e91;
  224. }
  225. .bo[disabled] {
  226. color: #899bc1;
  227. }
  228. .p[disabled] {
  229. color: #91b4fd;
  230. }
  231. .b .bo[disabled]:hover {
  232. background-color: #4267b2;
  233. }
  234. .b .p[disabled]:hover {
  235. background-color: #4080ff;
  236. }
  237. .bn {
  238. font-size: 14px;
  239. height: 44px;
  240. line-height: 44px;
  241. padding: 0 20px;
  242. }
  243. .n .q {
  244. display: inline-block;
  245. }
  246. .b .n .q {
  247. display: inline-block;
  248. margin-top: 0;
  249. vertical-align: middle;
  250. }
  251. .b a.n::after {
  252. content: "";
  253. display: inline-block;
  254. height: 100%;
  255. vertical-align: middle;
  256. }
  257. .n .q {
  258. line-height: 20px;
  259. margin-top: 4px;
  260. }
  261. .bn .q {
  262. line-height: 24px;
  263. margin-top: 10px;
  264. }
  265. .n.bm {
  266. display: block;
  267. width: 100%;
  268. }
  269. a.n.bm,
  270. .b label.n.bm {
  271. display: block;
  272. width: auto;
  273. }
  274. .b .n {
  275. padding: 0 8px;
  276. }
  277. .b a.n {
  278. height: 26px;
  279. line-height: 26px;
  280. }
  281. .b .bn {
  282. padding: 0 19px;
  283. }
  284. .b a.bn {
  285. font-size: 14px;
  286. height: 42px;
  287. line-height: 42px;
  288. }
  289. .q {
  290. pointer-events: none;
  291. }
  292. body {
  293. text-align: left;
  294. direction: ltr;
  295. }
  296. body,
  297. tr,
  298. input,
  299. textarea,
  300. button {
  301. font-family: sans-serif;
  302. }
  303. body,
  304. p,
  305. figure,
  306. h1,
  307. h2,
  308. h3,
  309. h4,
  310. h5,
  311. h6,
  312. ul,
  313. ol,
  314. li,
  315. dl,
  316. dd,
  317. dt {
  318. margin: 0;
  319. padding: 0;
  320. }
  321. h1,
  322. h2,
  323. h3,
  324. h4,
  325. h5,
  326. h6 {
  327. font-size: 1em;
  328. font-weight: bold;
  329. }
  330. ul,
  331. ol {
  332. list-style: none;
  333. }
  334. article,
  335. aside,
  336. figcaption,
  337. figure,
  338. footer,
  339. header,
  340. nav,
  341. section {
  342. display: block;
  343. }
  344. .d #viewport {
  345. margin: 0 auto;
  346. max-width: 600px;
  347. }
  348. .f {
  349. background-color: #fff;
  350. }
  351. .h {
  352. background-color: #3b5998;
  353. }
  354. .y {
  355. background-color: #eceff5;
  356. }
  357. #page {
  358. position: relative;
  359. }
  360. .b .o span {
  361. font-size: 14px;
  362. }
  363. .i {
  364. padding: 2px 3px;
  365. }
  366. .j {
  367. width: 100%;
  368. }
  369. .j .l {
  370. text-align: right;
  371. }
  372. .k {
  373. border: 0;
  374. display: inline-block;
  375. vertical-align: top;
  376. }
  377. i.k u {
  378. position: absolute;
  379. width: 0;
  380. height: 0;
  381. overflow: hidden;
  382. }
  383. body,
  384. tr,
  385. input,
  386. textarea,
  387. .g {
  388. font-size: medium;
  389. }

:apl: