Change the Content/Title of Button using css

Question

User-2079686736 posted

I have one requirement to change the button content /Title using css how i can do this ??

Answer 1

User1724605321 posted

Hi ,

May i know why you want to change the content of button by css ? I would suggest use some sort of client-side language (JavaScript, jQuery, etc.) or server-side language (php, ASP.NET, etc.) to achieve that. Code below is how to use jquery to change button text:

<input type='button' value='Add' id='btnAddProfile'>
$("#btnAddProfile").attr('value', 'Save'); //versions older than 1.6

<input type='button' value='Add' id='btnAddProfile'>
$("#btnAddProfile").prop('value', 'Save'); //versions newer than 1.6

<!-- Different button types-->

<button id='btnAddProfile' type='button'>Add</button>
$("#btnAddProfile").html('Save');

Best Regards,

Nan Yu

Answer 2

User-691209617 posted

Hi, K.Ajay Singh,

you can change content in following way.

HTML

<input id="example-checkbox" type="checkbox">
<label for="example" id="example">Show</label>

CSS

#example {
  ;
}
#example-checkbox {
  display: none;
}
#example-checkbox:checked + #example:after {
  content: "Hide";
  ;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: white;
}