Макет панели начальной загрузки

Привет, я пытаюсь сделать панель в бутстрапе. Я новичок в этом, так что извините, если это простой вопрос. Я пытаюсь создать такую панель, как этот сайт: Website Макет панели начальной загрузки

До сих пор я сделал заголовок, тело и нижний колонтитул, однако я не могу создать его часть тела, я запутался, чтобы создать его, и все, что я пытаюсь, за работой. Если кто-то может помочь мне в этом и объяснить, что это будет большая помощь

код до сих пор:

<div class="container"> 
    <div class="panel panel-default"> 
    <div class="panel-heading">Panel Heading</div> 
    <div class="panel-body">Panel Content</div> 
    <div class="panel-footer">Panel Footer</div> 
    </div> 
</div>

Спасибо за помощь, ребята хх

Edit: К сожалению, я должен был бы сделать это ясно. Проблема, с которой я сталкиваюсь, заключается в создании содержимого в части тела. Итак, создаем пыльник для изображения, затем кнопку, а затем список ингредиентов. Это моя главная проблема.

источник

2016-02-23 EagleBlind

Я не могу понять вашу проблему, вот что вы получите: https://jsfiddle.net/1zct176v/ – silviagreen

Иам просто пытается воссоздать сайт exmaple, однако я не могу заставить часть тела работать, поэтому я не могу получить там пылеуловитель в теле со списком ингредиентов и т. д. – EagleBlind

Если вы используете Chrome/Firefox/Opera/Safari, щелкните правой кнопкой мыши элемент проверки мыши и посмотрите, какие классы и стили применяются к элементам. Также хорошо читать документацию Bootstrap. Это здорово, и вы можете многому научиться. http://getbootstrap.com/ – makshh

Вы должны иметь возможность вложить их в случае необходимости, поэтому это должно сработать.

<body> 

<div class="container"> 
    <h2>Panel Heading</h2> 
    <div class="panel panel-default"> 
    <div class="panel-heading">Panel Heading</div> 
    <div class="panel-body"> 
     <div class="panel panel-default"> 
      <div class="panel-heading">inner Panel Heading</div> 
      <div class="panel-body">innner panel body</div> 
      <div class="panel-footer">inner Panel Footer</div> 
     </div> 
     <div class="panel panel-default"> 
      <div class="panel-heading">inner Panel Heading</div> 
      <div class="panel-body">innner panel body</div> 
      <div class="panel-footer">inner Panel Footer</div> 
     </div> 
    </div> 
    <div class="panel-footer">Panel Footer</div> 
    </div> 
</div>

вот code pen макета

источник

2016-02-23 16:46:53 miln

Макет панели начальной загрузки

ответ

Смежные вопросы