Developer tools are available in most browsers, and activating them is easy. Learn how to find them, and get a quick overview of the most important features.
- [Narrator] Something that's going to come in…really handy as we work with CS elements…are the developer tools that are built into…almost every browser.…The developer tools will allow you to pinpoint objects…on the page and see their properties.…The good news is that the developer tools…are not only available in every browser,…you also turn them on more or less the same way.…Now let's start on the homepage of our site.…I'm going to start this demonstration in Firefox,…but this step is almost exactly the same…in Chrome, Internet Explorer, and Edge.…
I press F12.…There it is, there's the developer tools.…If I want to close it, I click F12 again and it's gone.…You can also find the developer tools…from the browser menus.…Here's where there is a few differences.…In Firefox or IE you click the menu…and you go to developer.…Then you're going to toggles tools.…Bam, there we are.…F12 and they're gone again.…Now in Chrome, it's a little bit different,…and I'm going to move over to Chrome.…
I have that open here.…Let me maximize this.…
Author
Phil Gold
Released
1/8/2018- 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
Duration
Views
-
Introduction
-
Welcome2m
-
What you need to know2m 5s
-
Course files1m 19s
-
-
1. The Branding Hierarchy
-
Change site logo and title3m 25s
-
Change site theme6m 29s
-
2. Creating a Custom Theme: Colors
-
3. Adding New Fonts
-
Sources for fonts2m 40s
-
Loading fonts to your site3m 50s
-
4. CSS Basics for Branding SharePoint
-
Why use CSS?2m 36s
-
Editing the CSS style sheet4m 53s
-
-
5. Modify SharePoint with CSS
-
6. More Styling: Page Elements
-
Style "new experience" pages3m 48s
-
Styling tables5m 53s
-
-
7. Getting Fancy: Custom CSS Elements
-
Initial considerations2m 9s
-
Allow for variable states3m 53s
-
-
Conclusion
-
Next steps1m 31s
-
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.
Share this video
Embed this video
Video: Activating the developer tools