Результаты поиска
Введите запрос, по завершению нажмите Enter.
  • Страница 1 из 1
  • 1
Верстка простого модуля
Отправлено 23.05.2012 - 23:111
Нет аватара
Пользователь
113 сообщений
Мужчина
Добрый вечер уважаемые верстальщики uSite.su!



Кто сможет бесплатно сверстать выделенный элемент и вписать в дизайн моего сайт? (затемненный сайт :D)
Буду очень благодарен,!

Профиль Личное сообщение Дом. страница icq Skype
20
Отправлено 23.05.2012 - 23:592
Нет аватара
Coder
627 сообщений
Мужчина
Code
<div class="block">
  <div class="title">
   <div class="title2">Title</div>
  </div>
  <div class="downloadBut">Download</div>
  <div class="file"><span style="color:#000;font-weight:bold;">File:</span> <span class="link">1324_file_sp.rar</span> <span class="size">[88 kb]</span></div>
  <div style="clear:both;"></div>
</div>

<style type="text/css">
.block {
  padding:5px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  border:1px solid #c7c7c7;
}
.title {
  border:1px solid #c7c7c7;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  background: rgb(245,245,245); /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(245,245,245,1) 0%, rgba(228,228,228,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(245,245,245,1)), color-stop(100%,rgba(228,228,228,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* IE10+ */
  background: linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e4e4e4',GradientType=0 ); /* IE6-9 */
}
.title2 {
  border-bottom:1px solid #f5f5f5;
  padding:5px 5px 4px 5px;
  font-weight:bold;
  color:#0c6fc2;
}
.downloadBut {
  border:1px solid #085db7;
  width:70px;
  padding:5px;
  margin-top:3px;
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
  font-weight:bold;
  text-align:center;
  color:#fff;
  float:left;
  background: rgb(26,135,228); /* Old browsers */
  background: -moz-linear-gradient(top,  rgba(26,135,228,1) 0%, rgba(9,105,186,1) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(26,135,228,1)), color-stop(100%,rgba(9,105,186,1))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* IE10+ */
  background: linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a87e4', endColorstr='#0969ba',GradientType=0 ); /* IE6-9 */
}
.downloadBut:hover {
  corsor:pointer;
}
.file {
  line-height:35px;
  padding-left:95px;
}
.link,.link a,.size {
  color:#296687;
}
.link a:hover,.link:hover{
  color:#296687;
  text-decoration:underline;
  cursor:pointer;
}
</style>
Профиль Личное сообщение Дом. страница icq Skype
66
Отправлено 24.05.2012 - 18:323
Нет аватара
Пользователь
113 сообщений
Мужчина
syp41k, Благодарю! xaxa я если честно, то сразу не понял откуда код, ведь я макет не прилагал, а тут бац и готово! Спасибо! Сейчас правлю под себя,

P.s. Администрация uSite объявите syp41k благодарность (печенькой может ) good

Добавлено (24.05.2012, 18:32)
---------------------------------------------
syp41k, Где можно написать отзыв!?
Вы предоставляете услуги по верстке/создании сайтов? Я бы с радостью написал отзыв!

Профиль Личное сообщение Дом. страница icq Skype
20
Отправлено 24.05.2012 - 18:414
Нет аватара
Бывалый
626 сообщений
Мужчина
а для кого придумали исходный ход? xaxa
Профиль Личное сообщение Дом. страница icq Skype
60
Отправлено 24.05.2012 - 18:445
Нет аватара
Пользователь
113 сообщений
Мужчина
Quote (-lisonok-)
а для кого придумали исходный ход?

смысле?
Кстати
Поправьте кто нибудь, чтобы вписался в диз, а то получается узкий, сколько раз не тыкал по цифрам, а не то.
Профиль Личное сообщение Дом. страница icq Skype
20
IPage
Сообщение от пользователя IPage с отрицательной репутацией.
Вы можете просмотреть это или все сообщения данного пользователя.
Отправлено 24.05.2012 - 18:487
Нет аватара
Пользователь
113 сообщений
Мужчина
Quote (IPage)
Вот именно

Уже бы не умничал, а помог расширить модуль.
Профиль Личное сообщение Дом. страница icq Skype
20
IPage
Сообщение от пользователя IPage с отрицательной репутацией.
Вы можете просмотреть это или все сообщения данного пользователя.
Отправлено 24.05.2012 - 18:539
Нет аватара
Designer
979 сообщений
Мужчина
Quote
.block, .blockbox {
margin: 0px 0px 8px 10px;
overflow: hidden;
width: auto;
}
Профиль Личное сообщение Дом. страница icq Skype
18
Отправлено 24.05.2012 - 19:0310
Нет аватара
Пользователь
113 сообщений
Мужчина
Quote (lapochka)
.block, .blockbox {
margin: 0px 0px 8px 10px;
overflow: hidden;
width: auto;
}

Все бы хорошо, но перейди на сайт посмотри, сьезжает дизайн
Профиль Личное сообщение Дом. страница icq Skype
20
Отправлено 24.05.2012 - 19:0711
Нет аватара
Бывалый
1029 сообщений
Мужчина
sergius, измени width: auto;
Профиль Личное сообщение Дом. страница icq Skype
97
Отправлено 24.05.2012 - 19:1312
Нет аватара
Designer
979 сообщений
Мужчина
Quote (sergius)
Все бы хорошо, но перейди на сайт посмотри, сьезжает дизайн
А кто виноват в том, что используешь одинаковые классы?
Профиль Личное сообщение Дом. страница icq Skype
18
Отправлено 24.05.2012 - 19:1513
Нет аватара
Coder
627 сообщений
Мужчина
Quote (IPage)
а для кого придумали исходный ход?

эм) тут по картинке все видно, скрин качественный..
sergius,

Code
<div class="block_download">    
     <div class="title">    
      <div class="title2">Title</div>    
     </div>    
     <div class="downloadBut">Download</div>    
     <div class="file"><span style="color:#000;font-weight:bold;">File:</span> <span class="link">1324_file_sp.rar</span> <span class="size">[88 kb]</span></div>    
     <div style="clear:both;"></div>    
    </div>    

    <style type="text/css">    
    .block_download {    
     padding:5px;    
     -webkit-border-radius: 3px;    
     -moz-border-radius: 3px;    
     border-radius: 3px;    
     border:1px solid #c7c7c7;    
    width:500px;
    margin:0 auto;
    }    
    .block_download .title {    
     border:1px solid #c7c7c7;    
     -webkit-border-radius: 3px;    
     -moz-border-radius: 3px;    
     border-radius: 3px;    
     text-align:left;
     background: rgb(245,245,245); /* Old browsers */    
     background: -moz-linear-gradient(top,  rgba(245,245,245,1) 0%, rgba(228,228,228,1) 100%); /* FF3.6+ */    
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(245,245,245,1)), color-stop(100%,rgba(228,228,228,1))); /* Chrome,Safari4+ */    
     background: -webkit-linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* Chrome10+,Safari5.1+ */    
     background: -o-linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* Opera 11.10+ */    
     background: -ms-linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* IE10+ */    
     background: linear-gradient(top,  rgba(245,245,245,1) 0%,rgba(228,228,228,1) 100%); /* W3C */    
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#e4e4e4',GradientType=0 ); /* IE6-9 */    
    }    
    .block_download .title2 {    
     border-bottom:1px solid #f5f5f5;    
     padding:5px 5px 4px 5px;    
     font-weight:bold;    
     color:#0c6fc2;    
    }    
    .block_download .downloadBut {    
     border:1px solid #085db7;    
     width:70px;    
     padding:5px;    
     margin-top:3px;    
     -webkit-border-radius: 3px;    
     -moz-border-radius: 3px;    
     border-radius: 3px;    
     font-weight:bold;    
     text-align:center;    
     color:#fff;    
     float:left;    
     background: rgb(26,135,228); /* Old browsers */    
     background: -moz-linear-gradient(top,  rgba(26,135,228,1) 0%, rgba(9,105,186,1) 100%); /* FF3.6+ */    
     background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(26,135,228,1)), color-stop(100%,rgba(9,105,186,1))); /* Chrome,Safari4+ */    
     background: -webkit-linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* Chrome10+,Safari5.1+ */    
     background: -o-linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* Opera 11.10+ */    
     background: -ms-linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* IE10+ */    
     background: linear-gradient(top,  rgba(26,135,228,1) 0%,rgba(9,105,186,1) 100%); /* W3C */    
     filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1a87e4', endColorstr='#0969ba',GradientType=0 ); /* IE6-9 */    
    }    
   .block_download .downloadBut:hover {    
     corsor:pointer;    
    }    
    .block_download .file {    
     line-height:35px;    
     padding-left:95px;    
     text-align:left;
    }    
    .block_download .link,.link a,.size {    
     color:#296687;    
    }    
    .block_download .link a:hover,.link:hover{    
     color:#296687;    
     text-decoration:underline;    
     cursor:pointer;    
    }    
    </style>


поставь, напиши я зайду посмотрю что не так...
у тебя фиксированный дизайн, если захочешь увеличить размеры, то в классе .block_download поиграйся с шириной
Профиль Личное сообщение Дом. страница icq Skype
66
Отправлено 24.05.2012 - 20:0214
Нет аватара
Пользователь
113 сообщений
Мужчина
syp41k, rose рад поуши, спасибо)
Профиль Личное сообщение Дом. страница icq Skype
20
  • Страница 1 из 1
  • 1
Поиск:
uSite.su © 2010-2025
Все права защищены.
Многогранность и сверхспособности сообщества uCoz заставляют задуматься даже самые стойкие умы веб-программирования, ведь лишь uSite способен предоставить ответы на самые сложные вопросы uCoz.
01RSS
Хостинг от uCozПользовательское соглашение и прочая информация