Set the color property of all <p> elements:
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"> </script>// w ww . j a va 2s . c o m <script> $(document).ready(function(){ $("button").click(function(){ $("p").css("color", "red"); }); }); </script> </head> <body> <button>Set the color property of all p elements</button> <p>This is a paragraph.</p> <p>This is another paragraph.</p> </body> </html>
The css() method sets or returns style properties for the selected elements.
As getter, the css() method returns the CSS property value of the first matched element.
As setter, the css() method sets the specified CSS property for all matched elements.
Return the CSS property value:
$(selector).css(property)
Set the CSS property and value:
$(selector).css(property,value)
Set CSS property and value using a function:
$(selector).css(property,function(index,currentvalue))
Set multiple properties and values:
$(selector).css({property:value,property:value, ...})
| Parameter | Description |
|---|---|
| property | the CSS property name, like "color", "font-weight", etc. |
| value | the value of the CSS property, like "red", "bold", etc. |
function(index,currentvalue) | sets a function that returns the new value for the CSS property index - the index position of the element in the set currentvalue - the current value of the CSS property |