It's important to understand some of the reasons for creating custom CSS elements vs. using inline styling. You should weigh the value of customization and consider ROI before creating new elements. You should also be aware of some of the risks.
- [Narrator] Up to this point we've been making…changes to existing CSS elements.…We've been redefining them to make them…look and act they way that we want.…But some of you are probably asking,…instead of cannibalizing existing CSS,…why don't we just make new elements…and define them exactly how we want them and use them?…Well, the simplest answer to that is,…yeah, you can do that, but it's not that simple.…We've already seen some of the HTML contained…on SharePoint pages, and it's fairly complex.…
There are multiple CSS sheets that SharePoint pulls from,…and multiple element classes might all be wrapped up…in some places with a separate ID.…Frankly, it's a complicated spider web.…If you modify existing CSS, you're not changing…any of the underlying structure.…You're only changing the way it behaves.…If Microsoft makes changes to the code,…they will typically reuse element names,…which means that your custom CSS definitions…have a good likelihood of carrying over.…
If you make changes to your site's underlying HTML,…
- Changing your site's logo, title, and theme
- Creating new palettes and themes
- Loading fonts to your site
- Calling font sets in your theme
- CSS basics for branding SharePoint
- Creating and uploading a blank CSS style sheet
- Modifying site navigation, fonts, and backgrounds
- Styling tables
- Defining new elements in your CSS file
- Creating new CSS elements directly into the style sheet
Skill Level Intermediate
SharePoint Online 2017: Beyond the Basicswith Gini von Courter3h 32m Intermediate
1. The Branding Hierarchy
2. Creating a Custom Theme: Colors
3. Adding New Fonts
4. CSS Basics for Branding SharePoint
5. Modify SharePoint with CSS
6. More Styling: Page Elements
7. Getting Fancy: Custom CSS Elements
Next steps1m 31s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.