Lynda Creating a Responsive Web Design

Category: Technical

Tag: Science/Engineering


Posted on 2016-07-05, updated at 2016-07-23, by nobihai.

Description

Image


Lynda Creating a Responsive Web Design 55 MP4, 1 ZIP |708.36 MB


nbsp;
Description
nbsp;
Creating a Responsive Web Design with Chris Converse
nbsp;
nbsp;

Image
Creating a Responsive Web Design
3h 47m Beginner Nov 09, 2015

Discover how to use responsive web design to make your site more readable and efficient—on any device. Chris Converse shares his own specialized techniques for combining HTML and CSS into a web layout that can adapt to different screen sizes and orientations. The course takes the site from start to finish, from setting up the HTML page and containers to styling established elements for small, medium, and large screens. Along the way, Chris shows how to reposition the nav bar for better viewing on mobile devices, create animated transitions, and turn bulleted lists into interactive menus with full touch support. Plus, learn how to use CSS pseudo-elements and adapt layouts for print to save ink and paper.
The exercise files for this course are free to all members. Download them and start creating your own responsive websites today.
Image
- Planning your layout
- Creating HTML containers, content, and links
- Creating and styling the layout with CSS
- Creating a menu system
- Styling headings, body text, and footers
- Styling and repositioning navigation links
- Swapping high-resolution graphics for Retina displays
- Making sure content is printable
Image
Introduction
Introduction to this course
About this course
Terms and technology we ll be covering
What you ll need to complete this course
About the exercise files
1. Preparing the HTML Content and Structure
Setting up our project
The strategy for our layout
Creating the main HTML containers
Adding content into the header
Adding content to the main section
Adding content to the atmosphere section
Adding content to the how-to section
Adding the navigation
Adding the footer content
2. Creating the Style and Layout with CSS
Importing a Google Font
Defining the basic text styles
Styling the heading and page container
Styling the logo and hero item
Creating the button style
Setting up a three-column row
Adding graphics to the main section
Clearing floats with pseudo-elements
Styling the atmosphere section
Styling the how-to section aside elements
Styling the how-to section blockquote element
Adding content with pseudo-elements
Styling the footer
3. Creating a Menu System with CSS
Repositioning the nav
Styling the nav list items and links
Showing and hiding the nav submenus
Device compatibility options for nav
Adding indication arrows
4. Making Layout Adjustments for Large and Medium Screens
Making minor adjustments for larger screens
Making adjustments for large screens
Making adjustments for medium screens
5. Making Adjustments for Small Screens
Moving the navigation for smaller screens
Adjusting to the logo and hero elements
Rearranging the main and atmosphere sections
Rearranging the how-to section
Rearranging the navigation
Adjusting the spacing of the navigation and footer
6. Making Adjustments for the Smallest Screens
Adjustments for the header and hero
Adjusting the how-to section
Adjusting the footer
7. Making Layout and Content Adjustments for Print
Strategy for printing
Linking a CSS file for print
Setting up the base styles
Setting up the header
Displaying URLS when printing
Main section
Atmosphere section
Switching our img tags with CSS
Styling the footer
Setting page breaks with CSS
Conclusion
What s next?
Image
Image
Image
Image[/center]
nbsp;
nbsp;

nbsp;
nbsp;
nbsp;




Search More...
Lynda Creating a Responsive Web Design

Search free ebooks in ebookee.com!


Related Archive Books

Archive Books related to "Lynda Creating a Responsive Web Design":



Links
Download this book

No active download links here?
Please check the description for download links if any or do a search to find alternative books.


Related Books


Comments

No comments for "Lynda Creating a Responsive Web Design".


    Add Your Comments
    1. Download links and password may be in the description section, read description carefully!
    2. Do a search to find mirrors if no download links or dead links.

    required

    required, will not be published

    need login

    required

    Not clear? Click here to refresh.

    Back to Top