Alignment or Indentation of code in salesforce

Step 1: If you want to align Apex code, visualforce Page code or Apex trigger code automatically ,

open that particular page or class or trigger in developer console.

Step 2: Select all code(press ctrl+A) and then go to Edit --> Fix Indentation. On clicking "Fix Indentation" the code will get aligned automatically.

Code before Alignment:
<apex:page controller="AccountAndContactsDisplay" action="{!displayAccounts}">
<apex:pageBlock title="Account and its Contacts">
<apex:pageBlockTable value="{!accountList}" var="acc">
<apex:column value="{!acc.name}" headerValue="Account Name"/>
<apex:column breakBefore="true">
<apex:pageBlock title="{!acc.name} related Contact Details">
<apex:pageBlockTable value="{!acc.contacts}" var="con" >
<apex:column value="{!con.name}" headerValue="Contact Name"/>
</apex:pageBlockTable>
</apex:pageBlock>  
</apex:column>
</apex:pageBlockTable>
</apex:pageBlock>
</apex:page>

Code after Alignment :

<apex:page controller="AccountAndContactsDisplay" action="{!displayAccounts}">
    <apex:pageBlock title="Account and its Contacts">
        <apex:pageBlockTable value="{!accountList}" var="acc">
            <apex:column value="{!acc.name}" headerValue="Account Name"/>
            <apex:column breakBefore="true">
                <apex:pageBlock title="{!acc.name} related Contact Details">
                    <apex:pageBlockTable value="{!acc.contacts}" var="con" >
                        <apex:column value="{!con.name}" headerValue="Contact Name"/>
                    </apex:pageBlockTable>
                </apex:pageBlock>  
            </apex:column>
        </apex:pageBlockTable>
    </apex:pageBlock>
</apex:page>