The styling of check boxes and radio buttons became possible with the introduction of the :checked pseudo-class in CSS3. A pure CSS method.
CSS styling checkbox

Demo here: Demo

Download from: Download

HTML of the following form is used for each checkbox or radio button:

Checkbox

<label class="checkbox-css">
<input type="Checkbox" name="checkbox" checked="">
<span></span> Check label
</label>

Radio button

<label class="radio-css">
<input type="radio" name="radio" checked="">
<span></span> radio label
</label>

Use CSS3 For  check boxes and radio buttons in the style sheet:

.checkbox-css, .radio-css {
line-height: 30px;
padding-left: 30px;
position: relative;
}
.checkbox-css > input[type="checkbox"], .radio-css > input[type="radio"] {
height: 0;
opacity: 0;
position: absolute;
width: 0;
}
.checkbox-css, .radio-css {
line-height: 30px;
padding-left: 30px;
position: relative;
}
.checkbox-css > input[type="checkbox"], .radio-css > input[type="radio"] {
height: 0;
opacity: 0;
position: absolute;
width: 0;
}
.checkbox-css > input[type="checkbox"] + span, .radio-css > input[type="radio"] + span {
border: 2px solid #333;
bottom: 0;
left: 0;
margin: auto;
position: absolute;
top: 0;
height: 15px;
width: 15px;
box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
-o-box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}
.radio-css > input[type="radio"] + span {
border-radius: 50%;
}
.radio-css > input[type="radio"]:checked + span, .checkbox-css > input[type="checkbox"]:checked + span {
background-color: #1038ef;
}

In this Adobe Photoshop design tutorial we learn how to create custom designs template in easy ways.

Subscribe on YouTube:
https://www.youtube.com/user/Anilkumar17890

How to Install XAMPP and WordPress Locally on PC/Windows in Hindi – AK Maurya

What is XAMPP?

XAMPP stands for cross-platform, Apache, MySQL, PHP and Perl. It’s a simple and lightweight solution that allows you to create a local web server for testing purposes.

What is WordPress?

WordPress is an online, open source website creation tool written in PHP. But in non-geek speak, it’s probably the easiest and most powerful blogging and website content management system (or CMS) in existence today.

Follow the steps below :

  • Go to the https://www.apachefriends.org/index.html and download XAMPP.
  • Install XAMPP on your system
  • Start up both Apache and MySQL in XAMPP control panel.
  • Download the latest version of WordPress. https://wordpress.org/download
  • Go to the XAMPP folder on your computer and open the htdocs folder – C:/XAMPP/htdocs. and page your WordPress files.
  • find the wp-config-sample.php file and rename it wp-config.php.
  • open in browser http://localhost/phpmyadmin
  • create a new data base and copy its name and enter in wp-config.php file.
  • Replace “username_here” with “root” and leave “password_here” blank, Save the file and close it.
  • Open your browser and go to http://localhost/your wordpres folder name/
  • chosen your language, continue onto the next screen and enter you username and password details. Click Install WordPress.
  • Your WordPress installation is now complete!