Создание панели и стиля Bootstrap

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

Так, например, этот сайт: Website

Пользуется бутстраповских для их панелями recopies. Это то, что я пытаюсь воссоздать с помощью панелей, но я не уверен, как это сделать. Я делал это до сих пор, однако это не выглядит так, как на веб-сайте на всех

Код:

<div id="mainContainer" class="container"> 
    <div class = "pannels"> 
    <div class="panel panel-default"> 
     <div class="panel-heading">Panel Title</div> 
     <div class="panel-body"> 
     <div class="row"> 
      <div class="col-lg-2 col-md-3 col-sm-4 col-xs-6"> 
      <div class="panel panel-default"> 
       <div class="panel-body"> 
       </div> 
      </div> 
      <div class="panel panel-default"> 
       <button type="button" class="btn btn-success">Success</button> 
      </div> 
      </div> 
      <div class="col-lg-10 col-md-9 col-sm-8 col-xs-6"> 
      <h4> 
      List Title 
      </h4> 
      <ul class="list-group"> 
       <li class="list-group-item">Item One</li> 
       <li class="list-group-item">Item Two</li> 
       <li class="list-group-item">Item One</li> 
       <li class="list-group-item">Item Two</li> 
       <li class="list-group-item">Item One</li> 
      </ul> 
      </div> 
     </div> 
     </div> 
     <div class="panel-footer"> 
     Here comes some text 
     </div> 
    </div> 
    </div> 
</div>

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

В любом случае любая помощь по этому вопросу была бы замечательной.

Thanks

источник

2016-02-23 Nevershow2016

Bootstrap не имеют весьма специфические стили, такие как то, что вы ищете. Вам нужно будет использовать CSS, возможно, переопределяя стили Bootstrap по умолчанию, чтобы получить желаемые результаты. – 4castle

А ну ладно, но чтобы получить макет, все это будет сделано в бутстрапе? – Nevershow2016

Да, Bootstrap - это библиотека для очень распространенных макетов и функций, поэтому это отличный выбор для начала работы. Вы можете настроить персонализированные настройки на макет, который он дает, переопределив различные классы с требуемой шириной, высотами, полями, дополнением, цветами и т. Д., Связав свой собственный файл CSS ** после ** файла Bootstrap CSS. – 4castle

Использовать CSS. Таким образом, в вашем теге head добавьте ссылку на свой собственный CSS-файл, который добавит стили, которые вы хотите. Но убедитесь, что он указан после, вы связываете файл Bootstrap CSS.

Ex.

<link rel="stylesheet" type="text/css" href="--Bootstrap URL Here--"/> 
<link rel="stylesheet" type="text/css" href="myCustomCSSFile.css"/>

Тогда внутри myCustomCSSFile.css положить вещи, как:

panel > panel { 
    height: 50%; 
    background-color: orange; 
}

или любых стилей, которые вы хотите.

Вот CSS учебник: W3Schools CSS Tutorial

источник

2016-02-23 15:19:09 4castle

Создание панели и стиля Bootstrap

ответ

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