CSS
HTML and CSS (Cascading Style Sheets) work hand in hand to construct and display accessible, searchable, and flexible
web pages. CSS is a versatile web design tool that lets you customize the layout of your web pages. Without CSS, the appearance
of your pages, including the fonts, sizes, colors, placement, and spacing is determined by the web browser. This course enables you to embrace your creativity and produce striking and adaptable web designs that are limited only by your imagination.
3 days - $1,895.00
Course taught by an expert Computer Coding Instructor.
Prerequisites:
Basic knowledge of a Mac or PC computer is required.
Course Outline
Getting Started with CSS
Determine the separate roles of HTML and CSS
Toggle a web page view to see it with or without its stylesheets
Avoid HTML techniques that hinder accessibility for disabled users
Insert CSS inside HTML
Specify color properties
Setting Basic Styles for a Web Page using CSS
Craft an embedded stylesheet that controls the entire HTML document
Design a basic "rule" to set the color for all the paragraphs on the page
Define what a CSS "selector" is and how it works
Set the default colors for the document and its various headings
Add comments and notes to your stylesheet
Validate HTML and CSS formatting using online tools
Using CSS to to Set Font Styles for an Entire Web Site
Create an external stylesheet for global site design and link to it from your HTML files
Specify whether the stylesheet should be used for screen, print or both
Define the preferred font for the various elements on your pages, and experiment with different font styles, such as italics, bold, and small caps
Styling Links & Other Design Elements
Assign colors and font information to unclicked links
Highlight a link as a user moves their mouse over it
Provide feedback as a user clicks a link
Alter the appearance of the first letter of headings and the first line in a paragraph
Text Formatting Techniques
Define a default font size for the page that can be read easily in different browsers
Experiment with text spacing and alignment to achieve the look you want
Indent text according to traditional print style guidelines, if that's what you need to do
Determine the style of bulleted and numbered lists
Images for Design Effects
Assign an image to be used as a bullet
Choose a background image for your web page and position it in the document
Fix the background image so that it doesn't scroll with the rest of the page
Modifying Specific Items
Give an element a unique identifier
Draft a rule that affects only members of a specific class, such as paragraphs of legal information
Control the appearance of an identified page element, such as a column of text
Designing with Boxes
Unveil an item's box in the browser window
Discern margins from padding
Remove the default document spacing between various page elements
Add margins to an item on a single side to create an indent
Add a borders to an object
Select between different border styles
Finagle border properties to create underlines and pseudo-bullets
Common Design Problems & Their Solutions
Recognize common design problems
Circumvent spacing differences in various browsers
Alleviate font size disasters
Further investigate bugs and hacks
Text Wrapping
Attributes to wrap text around an image or table
CSS rules for text wrapping
Wrap text around images on a web page
Restrict the width of a flow item such as a paragraph so text can wrap around it
Simple Layout Options
Organize and identify the basic page elements in your HTML
Establish a single column design with a header, main content and footer
Toggle the page design on and off with a browser toolbar to verify accessibility
Detail the advantages and disadvantages of fixed versus flexible designs
Specify a minimum width the page design must maintain
Transforming Lists Into Navigation Bars
Remove the bullet from a list
Make a list vertical or horizontal
Use a background image to display the list items with custom bullets or backgrounds
Disguise a list item, so that it looks like an navigation image or button
Alter the linked list item when the mouse hovers over it to create a rollover effect
Take advantage of the visited state to indicate followed links to a user
Tables and Forms
Legible, usable, multi-device, table structures
Common table styles including border and alternate row designs
Control the layout of form fields without employing a table
Establish a presentation for a user form
Stylize custom submission and reset buttons
Print Stylesheets
Difference between screen and print stylesheets
Designate a print stylesheet for your web page
Select print-friendly colors and backgrounds
Implement print-appropriate units of measurement including inches and points
Direct which page elements should be hidden in the print version
Supervise where page breaks should occur 
