Перейти к содержимому


Сделать Как Лендинг


  • Авторизуйтесь для ответа в теме
Сообщений в теме: 27

#21 Ingleest

Ingleest

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 406 сообщений
  • ГородTallinn

Отправлено 26 Март 2016 - 01:30

Просмотр сообщенияVaccina (18 Март 2016 - 05:29) писал:

<a class="add-cart button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block;">KATALOOG</a>

попробуйте заменить на:
<a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block;">KATALOOG</a>

Сейчас все работает, спасибо. Скажите еще, пожалуйста, как поменять цвет этой кнопочки.

#22 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 26 Март 2016 - 01:53

<a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block;">KATALOOG</a>

замените на:
<a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block; color: #fff; background-color: #FF0000;">KATALOOG</a>

Цветовые значения измените на необходимые.

#23 Ingleest

Ingleest

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 406 сообщений
  • ГородTallinn

Отправлено 06 Апрель 2016 - 12:29

Просмотр сообщенияVaccina (26 Март 2016 - 01:53) писал:

<a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block;">KATALOOG</a>

замените на:
<a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block; color: #fff; background-color: #FF0000;">KATALOOG</a>

Цветовые значения измените на необходимые.

Спасибо, все получилось!

Я сделал посадочную страницу, но на разных размерах экрана блоки на этой страничке ползут. Помогите, пожалуйста, отредактировать блок с картинкой и с объявлением так, чтобы размеры регулировались в процентах от размера экрана, а не по пикселям, как сейчас. Адрес страницы: сайт/page/laualambid-aktsia

Сообщение отредактировал Ingleest: 06 Апрель 2016 - 12:29


#24 Юля123

Юля123

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 567 сообщений

Отправлено 06 Апрель 2016 - 17:55

Просмотр сообщенияIngleest (06 Апрель 2016 - 12:29) писал:

Спасибо, все получилось!

Я сделал посадочную страницу, но на разных размерах экрана блоки на этой страничке ползут. Помогите, пожалуйста, отредактировать блок с картинкой и с объявлением так, чтобы размеры регулировались в процентах от размера экрана, а не по пикселям, как сейчас. Адрес страницы: сайт/page/laualambid-aktsia

Здравствуйте, у Вас объявление сделано в виде таблицы, а она плохо адаптируется под мобильные устройства, в связи с этим вопрос: куда можно переместить эту таблицу в мобильной версии? Может быть ее вообще скрыть? Или же перенести под картинку?

#25 Ingleest

Ingleest

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 406 сообщений
  • ГородTallinn

Отправлено 06 Апрель 2016 - 21:18

Вы, наверно, знаете, как это сделать просто блоком, не в таблице. Я не знаю: фрейм, div или что-то еще... Вы, пожалуйста, напишите, как таблицу превратить в такой блок. И в мобильной версии лучше его под картинку поместить.
спасибо.

#26 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 07 Апрель 2016 - 07:16

В описании страницы нажмите "Источник" и весь код замените на:
<div class="col-md-12 col-sm-12 col-sms-12 col-smb-12"><a href="http://british.ee/catalog/Säästlikud-sümpaatsed-laualambid" u="image"><img src="/design/1.jpg" style="width:100%;height:auto;"/></a></div>
<hr />
<div class="col-md-12 col-sm-12 col-sms-12 col-smb-12">
<div class="col-md-9 col-sm-9 col-sms-6 col-smb-12">
<h4 style="text-align: center;">Kategooriad</h4>​​
<div class="col-sm-6 col-sms-6 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Saastlikud-laualambid" title="Vaata kategooria «Säästlikud sümpaatsed laualambid»">
	<img class="goods-cat-image-medium" src="http://i2.british.ee/1/5195/51949543/a35910/sstlikud-smpaatsed-laualambid.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Saastlikud-laualambid" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Säästlikud sümpaatsed laualambid»">S&Auml;&Auml;STLIKUD S&Uuml;MPAATSED LAUALAMBID</a>
</div>
<div class="col-sm-6 col-sms-6 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Stiilsed-lambid" title="Vaata kategooria «Stiilsed lambid eluks»">
	<img class="goods-cat-image-medium" src="http://i2.british.ee/1/5195/51949541/a35910/stiilsed-lambid-eludest.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Stiilsed-lambid" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Stiilsed lambid eluks»">STIILSED LAMBID ELUKS</a>
</div>
<div class="col-sm-6 col-sms-6 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Vintage" title="Vaata kategooria «Vintage»">
	<img class="goods-cat-image-medium" src="http://i3.british.ee/1/5211/52104962/a35910/vintage.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Vintage" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Vintage»">VINTAGE</a></div>
<div class="col-sm-6 col-sms-6 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Muud" title="Vaata kategooria «Muud»">
	<img class="goods-cat-image-medium" src="http://i3.british.ee/1/5198/51972051/a35910/muud.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Muud" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Muud»">MUUD</a>
</div>
</div>

<div class="col-md-3 col-sm-3 col-sms-6 col-smb-12">
   <div style="border: 1px solid rgb(0, 0, 0); padding: 5px; margin-bottom: 10px;">
   <h1 style="box-sizing: border-box; font-weight: bold; text-rendering: optimizeLegibility; font-family: 'PT Sans'; text-transform: uppercase; line-height: 1.1; margin: 0px; padding: 0px; color: rgb(0, 0, 0); font-size: 36px; text-align: center;"><span style="box-sizing: border-box; font-size: 48px;"><strong style="box-sizing: border-box;"><span style="box-sizing: border-box; line-height: 18.2px;">LAUALAMP&nbsp;<br />
   EUROOPAST TEIE LAUAL 8. P&Auml;EVAGA!</span></strong></span></h1>
   </div>
  
   <div style="border: 1px solid rgb(0, 0, 0); padding: 5px; margin-bottom: 10px;">
   <h2 style="box-sizing: border-box; font-weight: bold; text-rendering: optimizeLegibility; font-family: 'PT Sans'; text-transform: uppercase; line-height: 1.1; margin: 0px; padding: 0px; color: rgb(0, 0, 0); font-size: 32px; text-align: center;"><a href="http://british.ee/catalog/Laualambid" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; transition: all 0.3s ease;"><span style="box-sizing: border-box; color: rgb(255, 0, 0);"><em style="box-sizing: border-box;">J&Otilde;UAD TELLIDA 31. M&Auml;RTSINI, SAAD EDISONI LAMBIPIRNI KINGITUSEKS!</em></span></a></h2>
   </div>
  
   <div style="border: 1px solid rgb(0, 0, 0); padding: 5px;"><a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block;">KATALOOG</a>&nbsp;</div>
</div>
</div>

данная структура должна быть полностью адаптивной, возможно потребуются мелкие корректировки.

#27 Ingleest

Ingleest

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 406 сообщений
  • ГородTallinn

Отправлено 07 Апрель 2016 - 23:27

Просмотр сообщенияVaccina (07 Апрель 2016 - 07:16) писал:

В описании страницы нажмите "Источник" и весь код замените на:

данная структура должна быть полностью адаптивной, возможно потребуются мелкие корректировки.
Спасибо. Я тут тоже внес поправки... Убрал категории. Теперь мне как сделать, чтобы блок с текстом был справа от картинки на всех экранах кроме мобильных?

#28 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 24 353 сообщений

Отправлено 08 Апрель 2016 - 01:12

Попробуйте использовать данную структуру:
<div class="col-md-12 col-sm-12 col-sms-12 col-smb-12">
<div class="col-md-9 col-sm-9 col-sms-12 col-smb-12"><a href="http://british.ee/catalog/Säästlikud-sümpaatsed-laualambid" u="image"><img src="/design/1.jpg" style="width:100%;height:auto;"/></a></div>
<div class="col-md-3 col-sm-3 col-sms-12 col-smb-12">
   <div style="border: 1px solid rgb(0, 0, 0); padding: 5px; margin-bottom: 10px;">
   <h1 style="box-sizing: border-box; font-weight: bold; text-rendering: optimizeLegibility; font-family: 'PT Sans'; text-transform: uppercase; line-height: 1.1; margin: 0px; padding: 0px; color: rgb(0, 0, 0); font-size: 36px; text-align: center;"><span style="box-sizing: border-box; font-size: 48px;"><strong style="box-sizing: border-box;"><span style="box-sizing: border-box; line-height: 18.2px;">LAUALAMP&nbsp;<br />
   EUROOPAST TEIE LAUAL 8. P&Auml;EVAGA!</span></strong></span></h1>
   </div>
 
   <div style="border: 1px solid rgb(0, 0, 0); padding: 5px; margin-bottom: 10px;">
   <h2 style="box-sizing: border-box; font-weight: bold; text-rendering: optimizeLegibility; font-family: 'PT Sans'; text-transform: uppercase; line-height: 1.1; margin: 0px; padding: 0px; color: rgb(0, 0, 0); font-size: 32px; text-align: center;"><a href="http://british.ee/catalog/Laualambid" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; transition: all 0.3s ease;"><span style="box-sizing: border-box; color: rgb(255, 0, 0);"><em style="box-sizing: border-box;">J&Otilde;UAD TELLIDA 31. M&Auml;RTSINI, SAAD EDISONI LAMBIPIRNI KINGITUSEKS!</em></span></a></h2>
   </div>
 
   <div style="border: 1px solid rgb(0, 0, 0); padding: 5px;"><a class="button" href="http://british.ee/catalog/Laualambid" style="margin: 10px auto 0px; display: block;">KATALOOG</a>&nbsp;</div>
</div>
</div>
<hr />
<div class="col-md-12 col-sm-12 col-sms-12 col-smb-12">
<h4 style="text-align: center;">Kategooriad</h4>​​
<div class="col-sm-3 col-sms-3 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Saastlikud-laualambid" title="Vaata kategooria «Säästlikud sümpaatsed laualambid»">
		<img class="goods-cat-image-medium" src="http://i2.british.ee/1/5195/51949543/a35910/sstlikud-smpaatsed-laualambid.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Saastlikud-laualambid" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Säästlikud sümpaatsed laualambid»">S&Auml;&Auml;STLIKUD S&Uuml;MPAATSED LAUALAMBID</a>
</div>
<div class="col-sm-3 col-sms-3 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Stiilsed-lambid" title="Vaata kategooria «Stiilsed lambid eluks»">
		<img class="goods-cat-image-medium" src="http://i2.british.ee/1/5195/51949541/a35910/stiilsed-lambid-eludest.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Stiilsed-lambid" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Stiilsed lambid eluks»">STIILSED LAMBID ELUKS</a>
</div>
<div class="col-sm-3 col-sms-3 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Vintage" title="Vaata kategooria «Vintage»">
		<img class="goods-cat-image-medium" src="http://i3.british.ee/1/5211/52104962/a35910/vintage.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Vintage" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Vintage»">VINTAGE</a></div>
<div class="col-sm-3 col-sms-3 col-smb-12" style="text-align:center;">
  <a class="image goods-cat-image-medium" href="http://british.ee/catalog/Muud" title="Vaata kategooria «Muud»">
		<img class="goods-cat-image-medium" src="http://i3.british.ee/1/5198/51972051/a35910/muud.jpg" />
  </a>
  <a class="title" href="http://british.ee/catalog/Muud" style="box-sizing: border-box; color: rgb(0, 0, 0); text-decoration: none; cursor: pointer; text-transform: uppercase; font-size: 20px; font-weight: bold; display: block; line-height: 25px; background: rgba(255, 255, 255, 0.298039);" title="Vaata kategooria «Muud»">MUUD</a>
</div>
</div>






Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных