四、Salesforce Styles_1
1.静态变量的使用:<apex:stylesheet value="{!$Resource.TestStyles}"/>
2.<apex:page>
<style type="text/css">
p { font-weight: bold; }
</style>
<p>This is some strong text!</p>
</apex:page>
3.css:h1 { color: #f00; }
p { }
newLink { color: #f60; font-weight: bold; }
引用:<apex:page showHeader="false">
<apex:stylesheet value="{!$Resource.customCSS}" />
<h1>Testing Custom Stylesheets</h1>
<p>This text could go on forever...<br/><br/>
But it won't!</p>
<apex:outputLink value="http://www.salesforce.com" styleClass="newLink">
Click here to switch to www.salesforce.com
</apex:outputLink>
</apex:page>
4.styleClass="asideText" 引用<style type="text/css"> .asideText { font-style: italic </style>
5.根据ID:<apex:page>
<style type="text/css">
[id*=myId] { font-weight: bold; }
</style>
<apex:outputText id="myId" value="This is way fancy !"/>
</apex:page>
6.判断浏览器:HTML Comments and IE Conditional Comments
7.嵌入html 和 head :<apex:page showHeader="false" sidebar="false" standardStylesheets="false"
applyHtmlTag="false" applyBodyTag="false" docType="html-5.0">
<html>
<body>
<header>
<h1>Congratulations!</h1>
</header>
<article>
<p>This page looks almost like HTML5!</p>
</article>
</body>
</html>
</apex:page>
8.当applyHtmlTag="false"时,其他元素是不好用的 ,除了红色标记
<html>
<apex:includeScript
value="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"/>
</html>
9.Custom Doctype Example
<apex:page docType="xhtml-1.0-strict" title="Strictly XHTML"
showHeader="false" sidebar="false">
<h1>This is Strict XHTML!</h1>
<p>
Remember to close your tags correctly:<br/>
<apex:image url="/img/icon-person.gif" alt="Person icon"/>
</p>
</apex:page>
10.Microsoft Excel ContentType Example
contentType="application/vnd.ms-excel"
11.Render a Visualforce Page as a PDF File
<apex:page renderAs="pdf">