CODEWITHSUNDEEP
htmlcss
user594659
user594659

Reputation: 27

diasble css style for specific element?

How can I set the default style for a checkbox in jquery or javascript or even html code? or in another way how to disable the styling for checkbox.

there is a external css file that set the style for all checkboxes, but I would like to override the style to default style for specific checkboxes.

thanks

Upvotes: 1

Views: 436

Answers (3)

andrewk
andrewk

Reputation: 3871

I use css' !important whenever I want to override some values.

But most modern browsers allow specific css selector like

 input[type="checkbox"] { 
            //insert style here
  }

you can use this to manipulate any style specific to checkboxes.

good luck.

Upvotes: 1

DoctorLouie
DoctorLouie

Reputation: 2674

This can be done easiest by controlling the CSS that's styling your check box to begin with.

Instead of the CSS on your page laying styles for all constants (body img input). Instead assign classes to the individual items if you want them styled a special way.

So dont use: 


input { background: #000; }

Use:


<style>
.mystyle { background: #000; }
</stlye>
</head>
<body>
<input type="checkbox" class="mystyle">

Check to make sure all CSS on your site is clear of constants, this will make sure everything is set to default on all your pages and only styled at your choosing.

Upvotes: 0

John K.
John K.

Reputation: 5474

You can use JQuery to reset a css value ... like

$(this).css("color","red");

------------samples------------

    $(document).ready(function() {

 /* see if anything is previously checked and reflect that in the view*/
 $(".checklist input:checked").parent().addClass("selected");

 /* handle the user selections */
 $(".checklist .checkbox-select").click(
 function(event) {
 event.preventDefault();
 $(this).parent().addClass("selected");
 $(this).parent().find(":checkbox").attr("checked","checked");

 }
 );

 $(".checklist .checkbox-deselect").click(
 function(event) {
 event.preventDefault();
 $(this).parent().removeClass("selected");
 $(this).parent().find(":checkbox").removeAttr("checked");

 }
 );

 });
 });

Upvotes: 0

Related Questions