How to call Visualforce Page when a custom button is clicked on standard detail page.

How to call Visualforce Page when a custom button is clicked on standard detail page.

Note: In order to associate particular visualforce page to that custom button,that vf page must use standard controller of that associated object,Otherwise this vf page won't be available in the list while selecting vf page.
Example:
Visualforce Page:
Name: CallingVfPageFromButton
<apex:page>
    This Visualforce Page is getting called when a custom button is clicked on standard Account Detail Page.
</apex:page>
When we try to associate this visualforce page to custom button ,this page won't be available in selection list as shown in below image.

Now modify the above vf page like this
<apex:page standardController="Account">
    This Visualforce Page iss getting called when a custom button is clicked on standard Account Detail Page.
</apex:page>
Now, try to associate this page..this page will be available on the selection list as shown in the image below.

Output: When we click on the custom button in Account record detail page..the vf page will be displayed as shown in the images below.