Пятница, 02 Ноября 2012 17:12

Новые функции в CSS

Written by 
Оцени эту запись
(1 Голос)

В CSS введены некоторые функции, которые можно применять для численных значений. В данной статье я расскажу о трех функциях - calc(), min() и max().

 

 

Вычисление значений при помощи данных функций можно реализовать в FF и WebKit браузерах, используя вендорные префиксы -moz- и -webkit:

 

Calc()

 

width: -webkit-calc(100%-40px);

width: -moz-calc(100%-40px);

 

 

Min()

 

width: -webkit-min(100%, 400px);

width: -moz-min(100%, 400px);

 

 

Max()

 

width: -webkit-max(100%, 400px);

width: -moz-max(100%, 400px);

 

 

Пример:

 

 

<div style="background: lightblue; width: auto; display: -webkit-box;">
<div style="background: blueviolet; width: -webkit-calc(100% - 50px); height: 50px; display: -webkit-box;">&nbsp;</div>
</div>

 

 

 

 

 

Также для вычислений можно использовать другие арифметические операции:

 

width: -webkit-calc(20%*2);

 

 

 

You have no rights to post comments

верстка | CSS | верстка сайтов | HTML | верстальщик | блочная верстка | JavaScript | css верстка | профессиональная верстка сайтов