Add to or override styles by injecting CSS style sheets into webpages.
After you've written a style sheet that can modify page presentation, you need to add it to your Safari App Extension and apply it to webpages.
A style sheet can apply to a single webpage, all webpages, or only some webpages—for example, webpages from certain domains. For your style sheet to be injected, you must specify either Some or All website access for your app extension. For details, see Access and Permissions. For more about injected style sheets, see About Injected Style Sheets and Scripts.
Add a Style Sheet
After specifying website access, add the style sheet to your Safari App Extension.
Add the CSS files to your extension’s Xcode target.
SFSafarikey to the
NSExtensionelement in your extension’s
Infofile. The value for this key is an array of dictionaries.
For each CSS file, add a dictionary to this array. Each dictionary must have a
Style Sheetkey whose value specifies the path (relative to the Resources directory of the bundle) to the style sheet to include.
You can have more than one injected style sheet. Style sheets are processed in the order in which they’re specified.
Your style sheet can reference resources in your app extension’s bundle. All relative URLs are relative to the Resources folder in the app extension’s bundle.