Home > DeveloperSection > Beginner > JQuery css method

JQuery css method

JQuery JQuery 
0 Comment(s)
 4169  View(s)
Rate this:

JQuery css method

In jQuery css () method is very useful. By using this method we can change style of elements. In this article I am trying to show you, how we can apply css method on web page. By using this method we can define element style, format, height or width etc. In this example <div>element contain text and I want to change font color of text by using css () method. In the page when button is clicked then css of <div> tag is changed as shown by following example


·         (“target”).css (“keyname”);

·         (“target”).css (“keyname”, value”);

·         (“target”).css({properties});



    <title>jQuery css method</title>

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

    <script type="text/javascript">

        $(document).ready(function()        {

            $("button").click(function()            {

                $("div").css("color","blue");//when button is clicked css will apply on <div> element







    <div style="width:300px;height:100px;position:relative"> <!--div element contain some text-->

       &nbsp;JQuery is a library that makes it quicker and easier

        to build JavaScript webpages and web application.



    Blue font





JQuery css method

If I will click Blue font button then it will change font color of <div> control as shown below:


JQuery css method





Don't want to miss updates? Please click the below button!

Follow MindStick