SHOW:
|
|
- or go back to the newest paste.
1 | <html> | |
2 | <head> | |
3 | <title> <M> </title> | |
4 | <link href="https://fonts.googleapis.com/css?family=Roboto" rel="stylesheet"/> | |
5 | <link href='//netdna.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/> | |
6 | <link rel="stylesheet" href="path/to/font-awesome/css/font-awesome.min.css"/> | |
7 | </head> | |
8 | <body> | |
9 | <style> | |
10 | body { | |
11 | background: #1b1b1b url("http://imageshack.com/a/img923/6271/DA2Pq1.png") repeat-x; | |
12 | margin:0; | |
13 | } | |
14 | #login { | |
15 | position:absolute; | |
16 | } | |
17 | #login input{ | |
18 | position:absolute; | |
19 | background:#141414; | |
20 | color:#ccc; | |
21 | border:0px solid #141414; | |
22 | width:200px; | |
23 | height:50px; | |
24 | border-radius:0px 3px 3px 0px; | |
25 | font-family: 'Roboto', sans-serif; | |
26 | opacity: 0.8; | |
27 | } | |
28 | #senha input{ | |
29 | position:absolute; | |
30 | background:#141414; | |
31 | color:#ccc; | |
32 | border:0px solid #141414; | |
33 | width:200px; | |
34 | height:50px; | |
35 | border-radius:0px 3px 3px 0px; | |
36 | font-family: 'Roboto', sans-serif; | |
37 | opacity: 0.8; | |
38 | } | |
39 | #enviar input{ | |
40 | color:#444444; | |
41 | position:absolute; | |
42 | background-color:#141414; | |
43 | width: 70px; | |
44 | height: 70px; | |
45 | border-radius:50px; | |
46 | font-family: 'Roboto', sans-serif; | |
47 | font-size:15px; | |
48 | border:4px solid #282828; | |
49 | } | |
50 | #enviar { | |
51 | margin-left:186px; | |
52 | margin-top:-80px; | |
53 | position: relative; | |
54 | z-index:10; | |
55 | } | |
56 | #enviar input:hover { | |
57 | color:transparent; | |
58 | background: #141414 url("http://imageshack.com/a/img924/9374/P9mfaq.png") center center/20px no-repeat; | |
59 | } | |
60 | #sistemalogin { | |
61 | margin-left:560px; | |
62 | margin-top:270px; | |
63 | } | |
64 | #iconuser { | |
65 | position: absolute; | |
66 | background:#141414; | |
67 | width:44px; | |
68 | height:50px; | |
69 | border-radius:3px 0px 0px 3px; | |
70 | margin-left: 456px; | |
71 | opacity: 0.8; | |
72 | } | |
73 | #iconpass { | |
74 | position:absolute; | |
75 | background:#141414; | |
76 | width:44px; | |
77 | height:50px; | |
78 | border-radius:3px 0px 0px 3px; | |
79 | margin-top:60px; | |
80 | margin-left:456px; | |
81 | opacity: 0.8; | |
82 | } | |
83 | #icons { | |
84 | margin-left:60px; | |
85 | } | |
86 | </style> | |
87 | <div id="icons"> | |
88 | <div id="iconpass"><img src="http://imageshack.com/a/img923/5516/Wwhrzw.png" width="28" style="margin-left:9px; margin-top:10px;"/></div> | |
89 | <div id="iconuser"><img src="http://imageshack.com/a/img923/7274/eIESaM.png" width="35" style="margin-left:5px; margin-top:9px;"/></i></div> | |
90 | </div> | |
91 | <div id="sistemalogin"> | |
92 | <form method="post"> | |
93 | <div id="login"><input type="text" name="Úsuario" placeholder="login"/></div><br/><br/><br/> | |
94 | <div id="senha"><input type="password" name="Password" placeholder="senha"/></div><br/><br/> | |
95 | <div id="enviar"><input type="submit" value="OK"/></div> | |
96 | </form> | |
97 | </div> | |
98 | </body> | |
99 | </html> |