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


Внимание!

На форуме можно зарегистрироваться в два клика, используя социальную сеть Вконтакте. Для этого нажмите сюда.


Фотография

Применение медиа-компонентов в Bootstrap


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

#1 Gardian

Gardian

    Новичок

  • Пользователи
  • Pip
  • 9 сообщений

Отправлено 03 Сентябрь 2016 - 10:47

Как применять медиа-компоненты в Bootstrap? Если честно то я смутно себе представляю что и как делать для получения итогового результата, то есть медиа-объекта + содержимое в текстовом формате. Намерен применять это в лендинге, реально? В качестве медиа-компонента должно получится фото того кто купил и  отзыв на конкретный товар. Мне нужно выяснить как все это прописать и т.д.



#2 darwin125

darwin125

    Пользователь

  • Пользователи
  • PipPip
  • 14 сообщений

Отправлено 03 Сентябрь 2016 - 13:20

Да, реально, так и применяется довольно часто. Выглядит это так как ниже на фото.

Прописать в том случае когда изображение слева нужно так:

1.	<!--Медиа-компонент-->
2.	<div class="media">
3.	  <!--Элемент a (ссылка), содержащий медиа-объект (изображение). Для элемента a задан класс .media-left, который располагает медиа-объект относительно контента слева-->
4.	  <a class="media-left" href="#">
5.	    <!--Медиа-объект (изображение)-->
6.	    <img class="media-object" src="image.png" alt="">
7.	  </a>
8.	  <!--Блок, содержащий контент-->
9.	  <div class="media-body">
10.	    <!--Заголовок-->
11.	    <h4 class="media-heading">...</h4>
12.	    <!--Некоторый текст-->
13.	    <p>...</p>
14.	  </div>
15.	</div>

Расположение медиа-объекта в любом случае может быть разве что с правой строны .media-right или с левой стороны .media-left.

 

bootstrap-4-media-component.png


  • Flayter это нравится

#3 nikita1982

nikita1982

    Пользователь

  • Пользователи
  • PipPip
  • 16 сообщений

Отправлено 05 Сентябрь 2016 - 02:24

Пока что ничего не понятно :) но красиво получается... :)

С помощью bootstrap можно столько хороших и красивых вещей сделать, загляденье. Основная задача это посмотреть и решить как это все работает. Надеюсь что время проведенное мной на форуме поможет мне и понять что и как делать и будет мотивировать достаточно.



#4 hovard

hovard

    Пользователь

  • Пользователи
  • PipPip
  • 11 сообщений

Отправлено 08 Сентябрь 2016 - 05:34

Пока что ничего не понятно :) но красиво получается... :)

С помощью bootstrap можно столько хороших и красивых вещей сделать, загляденье. Основная задача это посмотреть и решить как это все работает. Надеюсь что время проведенное мной на форуме поможет мне и понять что и как делать и будет мотивировать достаточно.

Конечно красиво, а главное в два счета, что и есть основной плюс работы с фреймворком, что можно применять простые решения и получать хороший результат. С этим может справится любой вебмастер, не обязательно быть великим спецом по работе со стилями.



#5 morandi

morandi

    Пользователь

  • Пользователи
  • PipPip
  • 15 сообщений

Отправлено 20 Сентябрь 2016 - 09:36

darwin125, интересно посмотреть и другие вариации работы с медиа-компонентами в бутстрапе.

Что еще можно делать и как именно?

Давно хотел такое делать но все руки не доходили до того чтобы разобраться как именно.



#6 FiKsiK

FiKsiK

    Пользователь

  • Пользователи
  • PipPip
  • 13 сообщений

Отправлено 21 Сентябрь 2016 - 17:11

Работать с медиа-компонентами в бутстрапе относительно просто, также как и работать со всем остальным. Хорошо что есть бутстрап с которым все так красиво получается и не так сложно. Работать с медиа-копонентами иначе гораздо сложнее.






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

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