Change Background Color on Focus

Viewing 1 replies (of 1 total)

  • To change the style of your CF7 forms you would need to edit the CSS style sheets used by your WordPress theme.

    Use Firebug or Chrome Dev Tools to examine the HTML and CSS of your CF7 form in detail. Once you understand how the HTML and CSS is configured in your CF7 form, you should be able to see the CSS changes you need to change the appearance of the form to suit your requirements.

    See Styling Contact Form for a general explanation of styling CF7 forms using CSS.

    For example to change the background color to black when the textarea is clicked, you may do something like this

    textarea.wpcf7-form-control.wpcf7-textarea:focus {background: #000;}

    Also good idea to target CSS classes & ids used within your CF7 forms only, so that your CSS changes don’t inadvertantly effect other elements on your website.
    Add all your CSS via custom CSS plugin or a child

Viewing 1 replies (of 1 total)
  • The topic ‘Change Background Color on Focus’ is closed to new replies.