Разширете · Bootstrap на български

Bootstrap е направен с LESS в основата си, динамичен стилов език, създаден от нашия добър приятел, Алексис Селиер . Това прави разработването на базиран на системи CSS по-бързо, по-лесно и по-забавно.

Защо ПО-МАЛКО?

Един от създателите на Bootstrap написа бърза публикация в блог за това , обобщена тук:

Bootstrap компилира по-бързо ~6 пъти по-бързо с Less в сравнение със Sass
По-малко се пише в JavaScript, което ни улеснява да се гмурнем и да коригираме в сравнение с Ruby със Sass.
По-малко е повече; искаме да се чувстваме сякаш пишем CSS и правим Bootstrap достъпен за всички.

Какво е включено?

Като разширение на CSS, LESS включва променливи, миксини за повторно използвани фрагменти от код, операции за проста математика, влагане и дори цветни функции.

Научете повече

Посетете официалния уебсайт на http://lesscss.org/ , за да научите повече.

Тъй като нашият CSS е написан с Less и използва променливи и миксини, той трябва да бъде компилиран за окончателно производствено внедряване. Ето как.

Забележка: Ако изпращате заявка за изтегляне до GitHub с модифициран CSS, трябва да прекомпилирате CSS чрез някой от тези методи.

Инструменти за компилиране

Командна линия

Следвайте инструкциите в readme на проекта в GitHub за компилиране чрез командния ред.

JavaScript

Изтеглете най-новия Less.js и включете пътя до него (и Bootstrap) в <head>.

<link rel="stylesheet/less" href="/path/to/bootstrap.less"> rel = "stylesheet/less" href = "/path/to/bootstrap.less" > 
<script src="/path/to/less.js"></script><script src = "/path/to/less.js" ></script>

За да компилирате отново .less файловете, просто ги запазете и презаредете страницата си. Less.js ги компилира и ги съхранява в локално хранилище.

Неофициално приложение за Mac

Неофициалното приложение за Mac наблюдава директории с .less файлове и компилира кода в локални файлове след всяко запазване на наблюдаван .less файл. Ако желаете, можете да превключвате предпочитанията в приложението за автоматично минимизиране и в коя директория завършват компилираните файлове.

Още приложения

хрускам

Crunch е страхотно изглеждащ LESS редактор и компилатор, изграден на Adobe Air.

CodeKit

Създаден от същия човек като неофициалното приложение за Mac, CodeKit е приложение за Mac, което компилира LESS, SASS, Stylus и CoffeeScript.

Лесно

Приложение за Mac, Linux и Windows за компилиране с плъзгане и пускане на LESS файлове. Освен това изходният код е в GitHub .

Бързо стартирайте всеки уеб проект, като пуснете компилиран или минимизиран CSS и JS. Слой върху персонализирани стилове отделно за лесни надстройки и поддръжка напред.

Файлова структура за настройка

Изтеглете най-новия компилиран Bootstrap и го поставете във вашия проект. Например, може да имате нещо подобно:

  приложение/
      оформления/
      шаблони/
  публичен/
      css/
          bootstrap.min.css
      js/
          bootstrap.min.js
      img/
          glyphicons-halflings.png
          glyphicons-halflings-white.png

Използвайте начален шаблон

Копирайте следния основен HTML, за да започнете.

<html>
  <глава>
    <title> Шаблон Bootstrap 101 </title>
    <!-- Bootstrap -->
    <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >  
  </head>
  <тяло>
    <h1> Здравей, свят! </h1>
    <!-- Bootstrap -->
    <script src = "public/js/bootstrap.min.js" ></script> 
  </body>
</html>

Слой върху потребителски код

Работете с вашия персонализиран CSS, JS и други, ако е необходимо, за да направите Bootstrap ваш собствен със собствени отделни CSS и JS файлове.

<html>
  <глава>
    <title> Шаблон Bootstrap 101 </title>
    <!-- Bootstrap -->
    <link href = "public/css/bootstrap.min.css" rel = "stylesheet" >  
    <!-- Проект -->
    <link href = "public/css/application.css" rel = "stylesheet" >  
  </head>
  <тяло>
    <h1> Здравей, свят! </h1>
    <!-- Bootstrap -->
    <script src = "public/js/bootstrap.min.js" ></script> 
    <!-- Проект -->
    <script src = "public/js/application.js" ></script> 
  </body>
</html>

Разширяване на Bootstrap

Построен с ПО-МАЛКО