jQuery функция .css()
Раздел: Основы CSS
Опции: $( elem ).css( имя, [ значение ] )
Примеры использования:
Пример №1: Получить значения CSS
Чтобы получить значение свойства CSS элемента, используем следующее выражение $( elem ).css( имя )
<style> .test1 { border: 2px solid #060; height: 50px; width:300px; text-align:center; margin: 12px auto; background: #FF6 } </style>
var width = $("#test1").css('width');// результатом будет: 300px var height= $("#test1").css('height');// результатом будет: 50px var height= $("#test1").css('text-align');// результатом будет: center // не правильное использование var background= $("#test1").css('background');// результатом будет: '' //правильное использование var background= $("#test1").css('background-color');// результатом будет: rgb(255, 255, 102)
Здесь надо отменить, что различные браузеры могут по разному возвращать значения цвета в CSS
Например #FFF, #ffffff, and rgb(255,255,255)
background - background-color
margin - Если заданы стили margin-bottom, margin-left, margin-right, margin-top
border - borderTopWidth, borderRightWidth, borderLeftWidth, borderBottomWidth
Чтобы получить весь массив свойств: $( elem ).css([ "borderTopWidth", "borderRightWidth", "borderBottomWidth", "borderLeftWidth" ]). и так далее.
Пример №2: Установить значения CSS
Одно свойстро: $( elem ).css( "background-color", "yellow" );
Массив свойств: $( elem ) .css( { 'background-color' : 'yellow', 'font-weight' : 'bolder' } );
Живые примеры CSS: