Mon April 30

Css basic / CSS Selectors & inhertiance

9 – 12h Teaching

Teacher:

  • Hélène

Goals

  • I understand the CSS inheritance and apply it for my layouts
  • I use selectors
  • I can use ID's, CSS classes and pseudoclasses

Content

  • CSS Basic
  • CSS Selectors
  • Inheritance

RECAP – 27.04

  1. Q&A about images formats, iframes & forms

EXTERN

<head>
  <link rel="stylesheet" type="text/css" href="style.css">
</head>

INTERN

<head>
  <style>
    body{
      background-color:#f5f5f5;
      color:blue;
      font-size:1em;
      font-family:Arial, Sans-Serif;
    }
  </style>
</head>
<body>
</body>

INLINE

<p style="color:blue; margin-left:20px;">My text</p>


Selectors

Pseudo-classes

Web Safe Fonts, Font sizes

Colors

colorname (HTML color names / w3schools)

background-color: red;

Hexadecimal

background-color: #ff0000;

RGB (red, green, blue) 

background-color: rgb(255,255,255);

RGBA (red, green, blue, alpha) 

background-color: rgba(255,255,255, 0.5);


Color Tools

Portfolio

  • Add a folder with the name css to your project folder.
  • Create a new file in Sublime text and save this file as style.css to your css folder.
  • All HTML files need to include the style.css in the head
  • Now start to define styles

12 – 13.30h Lunch (Restaurant de la Piscine et Patinoire de Montchoisi)

13.30 – 17h Coaching

Coaches:

  • Ludovic
  • Benoît

Goals

  • I created my Style Sheet for my Portfolio and uploaded it to the web server
  • I start to create the webdesign of my Personal Project
  • I send my webdesign to Hélène (helene.portier@powercoders.org)

Portfolio

Finish your portfolio site and upload it to the web server

Personal Project

  • Create an Education Account on www.canva.com
  • Create a new file with custom dimensions (top right button): 1920x1080px
  • From your wireframe, start to create your webdesign on canva.com
  • Take attention to the small details (colors, margin, font, etc...)
  • Download your webdesign as a PDF and send it to helene.portier@powercoders.org before midnight