Функции и операции языка less.

Less позволяет использовать операторы и функции. Благодаря операциям можно складывать, вычитать, делить и умножать значения свойств и цветов, что можно использовать для создания сложных отношений между свойствами. Функции один к- дному отображаются в JavaScript код, позволяя обрабатывать значения.

Способ использования языка less.

LESS можно использовать на сайте различными способами. Первый способ — подключение к веб-странице JavaScript-файла less.js для преобразования кода в CSS средствами браузера[2].

Это делается, например, с помощью следующего html-кода:

<link rel="stylesheet/less" type="text/css" href="styles.less">

<script src="less.js" type="text/javascript"></script>

Второй способ – серверное преобразование .less файлов с помощью Rhino или node.js,

4. Пример использования фреймворка в системе мониторинга и прогнозирования.

При разработке компонента управления доступом TwitterBootstrap используется следующим образом:

1. Для построения каркаса приложения:

<div class="container">

<div class="row">

<div class="span12">

<div class="navbar">

<div class="navbar-inner">

<?php $this->widget('zii.widgets.CMenu', array(

'items' => array(

array('label' => 'Пользователи', 'url' => array('/user/index')),

array('label' => 'Иерархия', 'url' => array('/brand/index')),

array('label' => '(' . Yii::app()->user->getState('login') . ') Выйти', 'url' => array('/site/logout'), 'visible' => !Yii::app()->user->isGuest),

),

'htmlOptions' => array(

'class' => 'nav',

),

)); ?>

</div>

</div>

</div>

</div>

<div class="row">

<?php echo $content;?>

</div>

</div>

</body>

</html>

2. Для стандартизации элементов управления (создание формы);

<form action=”addRole.php”>

<fieldset>

<legend>Добавление роли </legend>

<label>Название</label>

<input type="name" placeholder=””>

<span class="help-block">Имя роли должно быть уникально</span>

<button type="submit" class="btn">Создать</button>

</fieldset>

</form>

Выводы.

Использования любого css – фреймворка является повышение скорости разработки пользовательского интерфейса, быстроты разработки и исключения максимально возможного числа ошибок вёрстки (проблемы совместимости различных версий браузеров и т. д.). Фреймворк TwitterBootstrap является подготовленной css библиотекой, которая позволяет использовать готовые элементы при верстке страниц.

Литература

1. Официальный сайт TwitterBootstrap. Режим доступа [http://twitter.github.io/bootstrap/base-css.html]. Дата обращения: 15.04.2013.

2. JavaScript в Bootstrap Режим доступа [http://mybootstrap.ru/javascripts/]. Дата обращения: 18.04.2013

3. LESS (язык стилей). Режим доступа [http://ru.wikipedia.org/wiki/LESS_(Язык стилей)]. Дата обращения: 15.04.2013.

4. TwitterBootstrap на русском. Режим доступа [http://bootstrap-ru.com/].Дата обращения: 15.04.2013.