Главная »  Скрипты »  Компактная форма входа серебряного цвета 09.08.2012 17:04
 
  DEMO  |  
 Ну что же, приступим к установке ?   Для начала можно посмотреть демонстрацию, а вот теперь давай посмотрим на код CSS:   Code    #logform{    width:260px;    border:none;    background:none;   }   input#lognamepass{    color:#666;    margin-top:3px!important;    font-size:14px!important;    width:255px!important;    padding:5px;    float:left!important;    box-shadow: 0 0 5px #ccc;    -mox-box-shadow: 0 0 5px #ccc;    -webkit-box-shadow: 0 0 5px #ccc;    border:1px solid #eee;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    background: -webkit-linear-gradient(top, #ccc, #fff)!important;    background: -moz-linear-gradient(top, #ccc, #fff)!important;    background: -ms-linear-gradient(top, #ccc, #fff)!important;    background: -o-linear-gradient(top, #ccc, #fff)!important;   }   input#logbutton{    color:#666;    font-size:14px!important;    float:left!important;    margin-top:3px!important;    width:255px!important;    cursor:pointer;    padding:5px 0 5px 0;    text-align:center;    display:inline-block;    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    border:none!important;    background: -webkit-linear-gradient(top, #ccc, #fff)!important;    background: -moz-linear-gradient(top, #ccc, #fff)!important;    background: -ms-linear-gradient(top, #ccc, #fff)!important;    background: -o-linear-gradient(top, #ccc, #fff)!important;    box-shadow: 0 0 5px #999;    -mox-box-shadow: 0 0 5px #999;    -webkit-box-shadow: 0 0 5px #999;   }   input#logbutton:hover{    -webkit-border-radius: 4px;    -moz-border-radius: 4px;    border-radius: 4px;    border:none!important;    -webkit-box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #666!important;    -moz-box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #666!important;    box-shadow: 0 0px 2px rgba(0,0,0,0.25), inset 0 0 3px #666!important;   }   input#lognamepass:focus{    border:1px solid #999;    box-shadow: 0 0 5px #999;    -mox-box-shadow: 0 0 5px #999;    -webkit-box-shadow: 0 0 5px #999;    background: -webkit-linear-gradient(top, #fff, #eee)!important;    background: -moz-linear-gradient(top, #fff, #eee)!important;    background: -ms-linear-gradient(top, #fff, #eee)!important;    background: -o-linear-gradient(top, #fff, #eee)!important;   }        Если нужно поменять размеры(для тех кто не знает как и что.) нужно изменить: 260px на свои значения.   Теперь нужно зайти в управление дизайном и найти "Форма входа пользователей"   И заменить там все этим кодом:Code    <div id="logform">   <input id="lognamepass" type="text" name="user" value="Логин/E-mail" onblur="if(this.value=='') this.value='Логин/E-mail';" onfocus="if(this.value=='Логин/E-mail') this.value='';"/>   <div style="clear:both;"></div>   <input id="lognamepass" type="password" name="password" value="**********" onblur="if(this.value=='') this.value='**********';" onfocus="if(this.value=='**********') this.value='';"/>   <div style="clear:both;"></div>   <input id="logbutton" name="sbm" type="submit" value="Войти" />   </div>     Теперь сохраняем и смотрим на результат.   И еще хочу сказать о условных операторах этой формы.   $LOGIN_FORM$ это - именно то что мы изменяем.(нужно ставить там где хотим видеть эту форму)   $LOG_FORM$ а это - стандартная форма входа, ее нельзя изменять, тем более мы используем красивую форму входа - зачем нужна стандартная ?  
		
	 |  
 
 |  
 
 
Добавлять комментарии могут только зарегистрированные пользователи.  Регистрация |  Вход  
 | 
Полезная информация
Мы настоятельно рекомендуем вам использовать браузеры последних версий. Нажмите на иконку, чтобы перейти к скачиванию нужного вам браузера 
Для правильного отображения сайта, вам понадобится минимальное разрешение экрана 1024 x 768px, оптимальное разрешение: 1280 x 1024px 
  
 
Mozilla Firefox - один из лучших браузеров (рекомендуем) 
Opera - Популярный браузер, но не полностью поддерживает CSS3 
Google Chrome - один из лучших и быстрых браузеров 
Safari - Качественый браузер от компании Apple 
Яндекс.Браузер - браузер от Яндекс на платформе Chrome 
 |