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>
|
