• Breaking News

    Tuesday 22 August 2017

    apex:slds - Include lightning design system by using apex tag



    To use lightning design system we don't need to upload library  to static resource and reference them in visual force page. We can include them by using apex tag i.e <apex:slds/>. here is example of include of slds in visual force page.


     1
     2
     3
     4
     5
     6
     7
     8
     9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    <apex:page standardStylesheets="false" sidebar="false" showHeader="false">
      <apex:slds/>
      <apex:form>
          <!-- Without lightning designing CSS-->    
          <div >
              <label for="inputLabel">Input Label</label>
              <div>
                 <input type="text" id="inputLabel"  placeholder="Without lightning designing CSS"/>  
              </div>
          </div>
          <!-- With lightning designing CSS-->
          <div class="slds-form-element">
              <label class="slds-form-element__label" for="inputLabel">Input Label</label>
              <div class="slds-form-element__control">
                 <input type="text" id="inputLabel" class="slds-input" placeholder="With lightning designing CSS"/>  
              </div>
          </div>    
      </apex:form>
    </apex:page>
    



    No comments:

    Post a Comment