apex Class :  public class NewClass {
    public list<account> acct{get;set;}
    public String csvString1{get;set;}
    public String csvString{get;set;}
    public string renderAsExcel{get;set;}
    public NewClass(){
        List<String> listOfAccountsFields = new List<String>{'Id','Name','Type' ,'Rating' ,'Ownership' , 'Active__c'};
            List<String> listOfContactsFields = new List<String>{'Id','LastName'};
                String csvString = String.join(listOfAccountsFields,',')+'\n';
        String csvString1= String.join(listOfContactsFields,',')+'\n';
        acct=[SELECT Id,Name,Type ,Rating ,Ownership , Active__c ,(SELECT Id,lastName from Contacts)
              From Account WHERE Name LIKE'%Account%' LIMIT 10];
        List<Contact> listOfContact = new List<Contact>();
        for(Account accRecord: acct) {
            listOfContact.addAll(accRecord.Contacts);
            //System.debug(listOfContact);
        }
        Map<Id,String> mappingAccAndCon = new Map<Id,String>();
        for(Contact abc: [SELECT AccountId, lastName FROM Contact]) {
            mappingAccAndCon.put(abc.AccountId,abc.lastName);
            system.debug(mappingAccAndCon);
            if(mappingAccAndCon.containsKey(abc.AccountId)){
                mappingAccAndCon.put(abc.AccountId,mappingAccAndCon.get(abc.AccountId)+abc.lastName);   
            }
        }
        for(Account acc:acct){
            for(String fieldName : listOfAccountsFields){
                csvString += '\"'+acc.get(fieldName)+'\",';
            }
            csvString += '\n';
            //csvString += map.get(acc.Id);
            for(String fieldName1 :listOfContactsFields){
                     csvString1 += '\"'+mappingAccAndCon.get(fieldName1)+'\",';
                }
                  csvString1 += '\n';
                system.debug(csvString1);
        }
        renderAsExcel= csvString;
        //system.debug(renderAsExcel);
    }
    public PageReference CSVExporter() {
        PageReference p = new PageReference('/apex/CSVExporter');
        p.setRedirect(true);
        return p;
        
    }
}



vf page 1:<apex:page controller="NewClass" tabStyle="Account">
    <apex:form >
        <apex:pageBlock > 
            <style>
                .myClass{
                color:white !important;
                background: #66b3ff !important;
                }
            </style>
            <Apex:commandButton value="Export as CSV" action="{!CSVExporter}" StyleClass="myClass" />       
        </apex:pageBlock>
    <apex:pageBlock >
            <table border="1">
                <tr>
                    <th>Name</th>
                    <th>Rating</th>
                    <th>Type</th>
                    <th>Active</th>
                    <th>Ownership</th>
                </tr>
                <apex:repeat var="acc" value="{!acct}">
                    <tr>
                        <td>{!acc.Name}</td>
                        <td>{!acc.Rating}</td>
                        <td>{!acc.Type}</td>
                        <td>{!acc.Active__c}</td>
                        <td>{!acc.Ownership}</td></tr>
                    <tr>
                        <th>   </th>
                        <th> Contact Id</th>   
                        <th>LastName</th>
                    </tr>
                    <apex:repeat var="c" value="{!acc.Contacts}">
                        <tr>
                            <td></td>
                            <td>{!c.id}</td>
                            <td>{!c.lastName}</td>
                        </tr>
                    </apex:repeat>
                </apex:repeat> 
            </table>
        </apex:pageBlock>
    </apex:form>
            </apex:page>

vf page 2:
<apex:page controller="NewClass" contentType="text/csv#Test.csv">
    <apex:outputText value="{!renderAsExcel}">
    </apex:outputText>
</apex:page>

please reply asap