« buvęs sekantis »
Puslapiai: [1]   Į apačią

Autorius Tema: Švari prisijungimo panelė su css'u ir html  (Skaityti 1037 kartai)

Lukas Liesis

  • Administratorius
  • Super HEROJUS
  • Žinutės: 3780
  • Karma: +110/-8

  • Aktyvumas per 30d.
    100%
Švari prisijungimo panelė su css'u ir html
« : 2009-12-02 01:33:32 »
taigi, vos ne kiekvienam puslapyje buna prisijungimo paneles, vienur grazesnes, kitur baisesnes, cia pora vairiantu svarios paneles. Manau nebloga praktika tiems, kurie stengiasi ismokti html/css dalyku :)


html kodas (viduje itrauktas ir css'as):
Kodas: [Pasirinkti]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Registravimosi formos</title>
<style type="text/css">
body{
font-family:"Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
}
p, h1, form, button{border:0; margin:0; padding:0;}
.spacer{clear:both; height:1px;}
/* ----------- forma ----------- */
.myform{
margin:0 auto;
width:400px;
padding:14px;
}
/* ----------- pirma----------- */
#basic{
border:solid 2px #DEDEDE;
}
#basic h1 {
font-size:14px;
font-weight:bold;
margin-bottom:8px;
}
#basic p{
font-size:11px;
color:#666666;
margin-bottom:20px;
border-bottom:solid 1px #dedede;
padding-bottom:10px;
}
#basic label{
display:block;
font-weight:bold;
text-align:right;
width:140px;
float:left;
}
#basic .small{
color:#666666;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
width:140px;
}
#basic input{
float:left;
width:200px;
margin:2px 0 30px 10px;
}
#basic button{
clear:both;
margin-left:150px;
background:#888888;
color:#FFFFFF;
border:solid 1px #666666;
font-size:11px;
font-weight:bold;
padding:4px 6px;
cursor:pointer;
}

#basic button:hover {
background-color:#0C0;
  }


/* ----------- antra----------- */
#stylized{
border:solid 2px #b7ddf2;
background:#ebf4fb;
}
#stylized h1 {
font-size:14px;
font-weight:bold;
margin-bottom:8px;
}
#stylized p{
font-size:11px;
color:#666666;
margin-bottom:20px;
border-bottom:solid 1px #b7ddf2;
padding-bottom:10px;
}
#stylized label{
display:block;
font-weight:bold;
text-align:right;
width:140px;
float:left;
}
#stylized .small{
color:#666666;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
width:140px;
}
#stylized input{
float:left;
font-size:12px;
padding:4px 2px;
border:solid 1px #aacfe4;
width:200px;
margin:2px 0 20px 10px;
}
#stylized button{
clear:both;
margin-left:150px;
width:125px;
height:31px;
background:#666666 url(button.png) no-repeat;
text-align:center;
line-height:31px;
color:#FFFFFF;
font-size:11px;
cursor:pointer;
font-weight:bold;
}
#stylized button:hover {
color:#CCC;
}
</style>
</head>

<body>
<div id="basic" class="myform">
  <form id="form1" name="form1" method="post" action="">
    <h1>Registracijos forma</h1>

    <p>Gerai atrodanti paprasta prisijungimo forma nenaudojant lentelių</p>
    <label>Vardas
        <span class="small">Įveskite savo vardą</span>
    </label>
    <input type="text" name="textfield" id="textfield" />
   
    <label>El. Pašto adresas
    <span class="small">Įveskite galiojantį el. pašto adresą</span>
    </label>

    <input type="text" name="textfield" id="textfield" />
   
    <label>Slaptažodis
        <span class="small">6 simboliai ir daugiau</span>
    </label>
    <input type="text" name="textfield" id="textfield" />
    <button  type="submit">Registruotis</button>
    <div class="spacer"></div>


  </form>
</div>

<br/><br/><br/>

<div id="stylized" class="myform">
  <form id="form1" name="form1" method="post" action="">
    <h1>Prisijungimo forma</h1>
    <p>Gerai atrodanti paprasta prisijungimo forma nenaudojant lentelių</p>
    <label>Vardas
        <span class="small">Įveskite savo vardą</span>

    </label>
    <input type="text" name="textfield" id="textfield" />
   
    <label>El. Pašto adresas
        <span class="small">Įveskite tinkamą el. pašto adresą</span>
    </label>
    <input type="text" name="textfield" id="textfield" />
   
    <label>Slaptažodis
        <span class="small">Bent 6 simboliai</span>
    </label>

    <input type="text" name="textfield" id="textfield" />
    <button  type="submit">Registruotis</button>
    <div class="spacer"></div>

  </form>
</div>

</body>
</html>


vienintelis reikalingas paveikslelis yra pridetas prie posto esanciame archyve

taip pat pridedu visa source'a kad butu vienoje vietoje :)

archyvo slaptazodis: manualai.lt
« Paskutinis taisymas: 2009-12-02 15:22:31 nuo primatas »
Prisijungęs
Jūsų draugas, kolega ir puslapio administratorius,

Lukas.
Manualai.lt Facebooke
Jums patinka manualai.lt projektas?
serveriai.lt 40% nuolaida!

Deividas Keturakis

  • HEROJUS
  • Žinutės: 994
  • Karma: +22/-1

  • Aktyvumas per 30d.
    0%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #1 : 2009-12-02 14:48:58 »
man patiko, šaunu :)
Prisijungęs
Slapyvardis : Ice

marvel

  • HEROJUS
  • Žinutės: 821
  • Karma: +11/-2
  • Wade can fly

  • Aktyvumas per 30d.
    25.88%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #2 : 2009-12-02 17:04:14 »
Not bad bandysiu koki syk ;)
Prisijungęs

evolution

  • Forumo naujokas
  • Žinutės: 2
  • Karma: +0/-0

  • Aktyvumas per 30d.
    0%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #3 : 2010-01-19 18:33:02 »
o kaip padaryti kad tuos registracijos duomenys issaugotu kokiam fale ir po to butu galima naudoti prisijungimui?
Prisijungęs

Macaque

  • HEROJUS
  • Žinutės: 787
  • Karma: +24/-0
  • makakuje.

  • Aktyvumas per 30d.
    43.53%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #4 : 2010-01-19 21:39:52 »
Citata iš: evolution on 2010-01-19 18:33:02
o kaip padaryti kad tuos registracijos duomenys issaugotu kokiam fale ir po to butu galima naudoti prisijungimui?


Atrodo kažkur forume yra padarytas toks dalykas su PHP ;] paieškok turėtai rasti :]
Prisijungęs
„Tik vienas dalykas gali svajonę padaryti neįgyvendinamą: tai baimė, kad nepasiseks. “ - Paulo Coelho

mano čiulbesiai

Rokas Bakūnas

  • HEROJUS
  • Žinutės: 532
  • Karma: +28/-0

  • Aktyvumas per 30d.
    4.71%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #5 : 2010-01-19 22:34:24 »
Tikrai grazu :)
tik vienas uzkliuvo dalykelis del pass laukeliu :) rodo ka rasai, na zinoma  pateiti:

type="text"  i  --> type="password" 

P.S. cia kas nezino ar pn.
Prisijungęs
Fata

Slaptazodis: manualai.lt
Jai failas ar mano postas tau praverte + karma ;)

Simas Aleksandravičius

  • Administratorius
  • HEROJUS
  • Žinutės: 916
  • Karma: +21/-1

  • Aktyvumas per 30d.
    1.18%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #6 : 2010-01-20 14:51:27 »
Graži panelė, tik mygtuko hoveris nlb patiko ;]
Prisijungęs
Prašome paspausti ant banerio



Jūsų draugas, kolega bei puslapio administratorius,

Simas Aleksandravičius

Draugas

  • Forumo naujokas
  • Žinutės: 2
  • Karma: +0/-0

  • Aktyvumas per 30d.
    0%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #7 : 2010-02-16 21:48:00 »
niekaip nesuprantu kaip jis tau per viduri laikos :-\
Prisijungęs

Macaque

  • HEROJUS
  • Žinutės: 787
  • Karma: +24/-0
  • makakuje.

  • Aktyvumas per 30d.
    43.53%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #8 : 2010-02-16 22:15:37 »
Citata iš: Draugas on 2010-02-16 21:48:00
niekaip nesuprantu kaip jis tau per viduri laikos :-\


Nežiūrėjau viso kodo, bet iškarto matau, kad prie formos tag'o aprašytas toks atributas

Kodas: (css) [Pasirinkti]
.myform{
margin:0 auto;
}

kuris pasako, kad bus lygiuojame centre ;]
Prisijungęs
„Tik vienas dalykas gali svajonę padaryti neįgyvendinamą: tai baimė, kad nepasiseks. “ - Paulo Coelho

mano čiulbesiai

Draugas

  • Forumo naujokas
  • Žinutės: 2
  • Karma: +0/-0

  • Aktyvumas per 30d.
    0%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #9 : 2010-02-17 00:27:03 »
Citata
Nežiūrėjau viso kodo, bet iškarto matau, kad prie formos tag'o aprašytas toks atributas

Kodas: (css) [Pasirinkti]
.myform{
margin:0 auto;
}

kuris pasako, kad bus lygiuojame centre ;]

dekui :) db zinosiu
Prisijungęs

Edmundas Ciucko

  • HEROJUS
  • Žinutės: 503
  • Karma: +26/-4

  • Aktyvumas per 30d.
    0%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #10 : 2010-07-08 13:21:58 »
Labai gražu, tas prisijungimo mygtukas net nereikalingas, reikėjo palikt kaip ir registracijoj :)
Prisijungęs
“It looks good” is the worst feedback you can get -
                                                                           Whitney Hess

filmai.in

Addiction

  • Forumo naujokas
  • Žinutės: 1
  • Karma: +0/-0

  • Aktyvumas per 30d.
    1.18%
Re: Švari prisijungimo panelė su css'u ir html
« Atsakyti #11 : 2011-01-27 14:17:23 »
Išties gražu ir paprasta :)
Reikės kur nors panaudoti
Prisijungęs
Puslapiai: [1]   Į viršų
« buvęs sekantis »