Join Jen Kramer for an in-depth discussion in this video Styling buttons, part of Learning Foundation 5.
…Buttons are useful to just about any page.…It's a way of drawing attention to an important call to action.…Think about how many web pages you've seen…which feature a very large button, for example.…Foundation has several combinations of classes used to style buttons.…As always, these are the defaults that come with foundation, which can be…overridden with SAS or standard CSS techniques…to make them look however you want.…I'm going to style the read more link on this…page, which is made of a simple a tag.…Button styling is also supported by the input tag and by the button tag.…
I'm still working on the typography document…I've used for the last two videos.…If you're just jumping in it's available in your Exercise Files folder.…Copy it into your Foundation folder.…And I'm going to scroll down here to line number thirty.…Line number thirty has our code for this read more.…While the link doesn't go anywhere, we're still going to…code this to make it look like a button.…So, it's very, very easy to code a button inside a foundation.…
- Downloading and installing Foundation 5
- Introducing grids
- Centering columns
- Nesting grids
- Styling text, lists, buttons, panels, and more
- Adding navigation bars and dropdown menus
- Creating a responsive lightbox
- Adding an image carousel
- Integrating responsive images
- Adding tooltips
Skill Level Beginner
CSS: Transitions and Transformswith Joseph Lowery2h 25m Intermediate
1. Overview of Foundation 5
2. The Grid System in Foundation
3. CSS Overview
4. Navigation Systems
Next steps1m 24s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
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.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.