Перейти к содержанию

Рекомендуемые сообщения

Здравствуйте, подскажите как сделать шапку такую как на скрине? 
 

image.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
19 минут назад, Sheedy сказал:

как сделать шапку такую как на скрине? 

верстальщик любую сверстает. были бы деньги.

  • +1 1

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
5 минут назад, tomm2001 сказал:

верстальщик любую сверстает. были бы деньги.

да ладно, я хочу сам научиться

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Гуглим: cover

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 07.03.2018 в 21:29, Pascha сказал:

Гуглим: cover

спасибо, разобрался) но теперь другая проблема. вот тут 5 картинок с ссылками которые я соединил вместе, но ни знаю как их адаптировать, чтобы при изменение масштаба они тоже растягивались или сужались.

 image.thumb.png.7cc1d4f565aae926630caf2dab574d51.png

 

Вот, при увеличение масштаба такая бяка получаетсяimage.thumb.png.ce6b924216463a3ff37e58df95eca531.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Остановитесь на варианте из 4 или 6 тизеров, т.к. у бутстрапа 12 колонок. Как вариант один блок можно сделать в 2 раза больше прочих, и тогда все прекрасно впишутся в сетку и адаптивность легко достижима.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
7 минут назад, zlatoff сказал:

Остановитесь на варианте из 4 или 6 тизеров, т.к. у бутстрапа 12 колонок. Как вариант один блок можно сделать в 2 раза больше прочих, и тогда все прекрасно впишутся в сетку и адаптивность легко достижима.

ага, ещё бы разораться с бустрапом... 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
25 минут назад, Sheedy сказал:

ага, ещё бы разораться с бустрапом... 

Держите бутстрапный блок на 4 тизера:

<div class="row">
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
</div>

12 колонок делим на 4 блока - получаем по 3 колонки на блок - т.е. col-sm-3. Если нужно на 6 блоков то меняйте на 2хколоночные блоки col-sm-2 и соответсвенно добавте в верстку еще 2 блока.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
В 10.03.2018 в 12:40, zlatoff сказал:

Держите бутстрапный блок на 4 тизера:


<div class="row">
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
	<div class="col-sm-3">
		<a href=""><img src="" alt="" class="img-responsive"></a>
	</div>
</div>

12 колонок делим на 4 блока - получаем по 3 колонки на блок - т.е. col-sm-3. Если нужно на 6 блоков то меняйте на 2хколоночные блоки col-sm-2 и соответсвенно добавте в верстку еще 2 блока.

ага, спасибо, понял, но теперь проблема в другом. А как расстояние между картинками убрать, чтобы все 4 были вместе? 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
9 минут назад, Sheedy сказал:

ага, спасибо, понял, но теперь проблема в другом. А как расстояние между картинками убрать, чтобы все 4 были вместе? 

Ааааааааа.... о5 таки учить бутстрап!!!! Там ВСЕ есть для этого.

Молодой человек вы чего хотите в итоге? Каковы ваши мотивации?

1) Вы хотите научится все делать сам - тут есть такие, и к ним все с уважением относятся, натаскиваем, самого учили, знаю - вас уже направили где копать - учите bootstrap и будете грамотно верстать без наших подсказок.

2) Вы бизнесмен и хотите делать деньги в e-commerce  - тогда читайте Маркса или Уорена Баффета - которые повторяют друг друга в том что прежде чем заработать денег, надо сначала их вложить в дело. Наймите спеца (хотя как выяснилось на форуме трудно найти нормального и свободного версталу), и не мучайте 5-ю точку.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
1 час назад, zlatoff сказал:

Ааааааааа.... о5 таки учить бутстрап!!!! Там ВСЕ есть для этого.

Молодой человек вы чего хотите в итоге? Каковы ваши мотивации?

1) Вы хотите научится все делать сам - тут есть такие, и к ним все с уважением относятся, натаскиваем, самого учили, знаю - вас уже направили где копать - учите bootstrap и будете грамотно верстать без наших подсказок.

2) Вы бизнесмен и хотите делать деньги в e-commerce  - тогда читайте Маркса или Уорена Баффета - которые повторяют друг друга в том что прежде чем заработать денег, надо сначала их вложить в дело. Наймите спеца (хотя как выяснилось на форуме трудно найти нормального и свободного версталу), и не мучайте 5-ю точку.

спасибо, я решил проблему, но немножко хитрым способом) 
скажите почему так? это что-то с сеткой бустрапа или я где-то накосячил, потому что в моб версии сайта такое же самое . Нигде не могу найти ответ, что делать  

image.thumb.png.85ed5ba174ee96b850075a5513442101.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
3 часа назад, Sheedy сказал:

спасибо, я решил проблему, но немножко хитрым способом) 
скажите почему так? это что-то с сеткой бустрапа или я где-то накосячил, потому что в моб версии сайта такое же самое . Нигде не могу найти ответ, что делать  

image.thumb.png.85ed5ba174ee96b850075a5513442101.png

Уже решил.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.