CSS Inline, External and Static Resource

<apex:page showHeader="true" sidebar="false" tabStyle="Account">
    <apex:form >
        <style>
          .InlineCssCls {
              color: brown;
            }
            h1{
              color: yellow;
            }
        </style> 
        <apex:stylesheet value="{!$Resource.ExtCSSFile}"/>
        <h1>
             My html content
        </h1>
        
    	<apex:sectionHeader title="My Page" description="" subtitle="Student" help="/apex/FirstPage">  <!-- {!flag} -->
    	</apex:sectionHeader>
        
        <apex:pageBlock title="Demo to pageblockSection Item" helpTitle="Block Help" helpUrl="/apex/DemoPage">
             <apex:pageBlockSection title="my section" columns="1">
                <apex:pageBlockSectionItem >
                	<apex:outputLabel styleClass="myCss">My Name</apex:outputLabel>
                	<apex:inputText /> 
                </apex:pageBlockSectionItem>      
                
                 <apex:pageBlockSectionItem >
                	<apex:outputLabel style="color: blue;">About Me</apex:outputLabel>
                	<apex:inputTextarea />  
                 </apex:pageBlockSectionItem>
                    
                <apex:pageBlockSectionItem > 
                	<apex:outputLabel value="Password" styleClass="InlineCssCls"></apex:outputLabel>
                	<apex:inputSecret />   
                </apex:pageBlockSectionItem>
                 
 		<apex:pageBlockSectionItem > 
                    <apex:outputLabel value="Yes/No" styleClass="myCSS"></apex:outputLabel>
                	<apex:inputCheckbox />   
                </apex:pageBlockSectionItem>

            </apex:pageBlockSection> 
        </apex:pageBlock>    
   </apex:form>     
</apex:page>

Related posts

Leave a Comment