Web design using css
Download
1 / 7

Web Design Using CSS - PowerPoint PPT Presentation


  • 49 Views
  • Uploaded on

Web Design Using CSS. Web Development Michael Russell. What is CSS?. CSS – Cascading Style Sheets Text based Provides the means to create styles for structured (X)HTML documents Can be used to define position, fonts, colours and graphics for page elements

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about ' Web Design Using CSS' - aleda


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
Web design using css

Web Design Using CSS

Web Development

Michael Russell


What is css
What is CSS?

  • CSS – Cascading Style Sheets

  • Text based

  • Provides the means to create styles for structured (X)HTML documents

  • Can be used to define position, fonts, colours and graphics for page elements

  • Provides detailed flexibility in conjunction with (X)HTML id and class elements


Css syntax
CSSSyntax

  • Selector { property:value; property:value; }

    e.g.

    H1 { color : red ; font-size : 16; }


Why use css
Why Use CSS?

  • Separate content structure from design

  • Standards – create one design to work across all platforms and browsers

  • Efficiency – change one file to change an entire site’s design

  • Team work – provides a single, standard working method

  • Accessibility. Accessibility. Accessibility.


Inline styles
Inline styles

  • CSS styles can be defined within the (X)HTML

  • E.g.:

    <p style=“color: #ff0000;”>This will be red.</p>

  • Avoid inline styles as much as possible

  • Always be able to justify an inline style specification when used

  • Will always override styles specified in the <head> or external style sheets


Head head styles
<head></head> styles

  • Styles defined in the head of an (X)HTML document

  • Usually useful only for testing, debugging, or “hacks” when absolutely required

  • Makes sense if the “site” has only one page (very rare!)

  • Are defined on a page by page basis

  • Will override external file style sheets, but are overridden by inline styles

  • Should be avoided


External style sheets
External style sheets

  • Styles defined in a separate text file

  • File can be linked to from unlimited (X)HTML files in a site

  • Properly managed, changes to one file redesign an entire site

  • Can be cached separately to the (X)HTML files, reducing bandwidth usage

  • Is overridden by <head> and inline styles

  • Is the preferred method for defining CSS


ad