[ Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Новая форма входа для uСoz
BaXa-26 Пятница, 11.05.2012, 09:30 | Сообщение # 1
Offline
Сообщений: 151
Награды:3


TML-Code

Code
<div id="forma_vxoda">    
    <div id="vxod-1">    
    <input class="login_email" value="" onclick="this.className='web_os'" type="text" name="user" size="20" maxlength="50" />    
    <input class="login_pass" value="" onclick="this.className='web_os'" type="password" name="password" size="20" maxlength="15" />    
    </div>    
    <div id="vxod-2"><input class="login_knopka" name="sbm" type="submit" value=""/></div>    
    <div id="vxod-3">    
    <div id="vxod-4"><a href="#">Забыл пароль</a> | <a href="#">Регистрация</a></div>    
    <div id="vxod-5"><label for="rem$PAGE_ID$"></label><input id="rem$PAGE_ID$" type="checkbox" name="rem" value="1" checked="checked"/></div>    
    </div>    
    </div>


В CSS

Code
/* ФОРМА ВХОДА    
    ===================================================*/    
    #forma_vxoda {    
    overflow: hidden;    
    width:250px;    
    margin: 10px 0px;    
    }    

    #vxod-1 {    
    float:left;    
    width:210px;    
    }    

    #vxod-2 {    
    float:left;    
    width:40px;    
    }    

    #vxod-3 {    
    float:left;    
    width:100%;    
    }    

    #vxod-4 {    
    float:left;    
    padding-left: 22px;    

    }    
    #vxod-5 {    
    float:right;    
    padding-right: 6px;    
    }    

    #vxod-4,    
    #vxod-5 {    
    font:11px Verdana,Arial,Helvetica, sans-serif;    
    }    

    .web_os,    
    .login_pass,    
    .login_email {    
    font:11px Verdana,Arial,Helvetica, sans-serif; color:#555;    
    width:198px;    
    border:1px solid #bebebe;    
    margin: 0px 0px 12px 0px;    
    background:#fff;    
    padding: 5px 5px 5px 5px;    
    }    

    .login_email {    
    background: url('fon_login_email.png') no-repeat center #fff;    
    }    

    .login_pass {    
    background: url('fon_login_pass.png') no-repeat center #fff;    
    }    

    .login_knopka {    
    width:30px;    
    height:62px;    
    border: 0;    
    background: url('fon_login_knopka.png') no-repeat top;    
    margin-left: 10px;    
    }    
    /* =================================================*/


Примечание:

Данная форма входа, версталась под DOCTYPE 1.1

HTML-Code

Code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">  
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru">


- под другой DOCTYPE я не тестировал данный код, если кто установил форму входа, с другим DOCTYPE и внёс в него улучшения, напиши об этом в комментариях
- при отсутствии DOCTYPE вообще, форма входа смотриться иначе только в браузере Internet Explorer 8 (это и понятно)




  • Страница 1 из 1
  • 1
Поиск: