Schedule
FTP
Overview
Cascading Style Sheets
Inline/Embedded/External CSS
selectors { property : value; } example: p { color:blue;}
CSS Principles (what gets applied?)
inheritance
location (cascade)
specificity
!important ( color: red !important; )
Defining Selectors:
name element: h1, p,
name class or id: .stanza, #bio
context: #bio img, .stanza h3
pseudo-classes :p::first-letter, p:first-of-type, p:first-of-type:first-letter,
link-styles : a:link, a:hover (add to blackbird)
attribute or values
CSS Properties and Values:
CSS Value Units
0, 12px, 50%, 1.5em
Formatting text :
color
font-family (web fonts)
font-size (px,%,em)
font-weight (bold)
font-style (italic/oblique)
text-decoration (underline, overline, line-through, none)
text-align (center, left, justify)
Typography rules of thumb:
no more than 2 fonts
difference, repetition,
padding and white-space
line-height:1.5;
10-15 words per line,
———————–
Overview of HTML (Quiz 1 review):
*Outline all block elements with colored border to see them
Block-level Styles (the Box Model):
box-model
width/height
margin
padding
borders – (pixel width, line-type, color) example: border: 1px solid red;
backgrounds – example: background-color: lightblue; or background: lightblue;
Styling block-level elements:
width/height (px, % or em)
max-width and min-width (in pixels)
max-height and min-height
padding (px or %) –
- padding: 5px;
- padding: 5px 10px;
- padding: 5px 2px 10px 12px;
margin (px or %) –
- margin: 5px;
- margin: 5px 10px;
- margin: 5px 2px 10px 12px;
*collapsible margins on vertical boxes- the bigger margin overtakes smaller
Moving elements to center:
margin: 0 auto; // NOT <center>!
Background Property:
HTML Quiz February 11th
Overview of HTML (quiz 1 review)
Blackbird Projects Due February 20th
Nouspace Research Gallery: Blackbird Projects
FTP= “file transfer protocol”
– uploading web files to the server using FTP (file transfer protocol)
-we will use a free Mac ftp client called Cyberduck Mac, Cyberduck PC is also available.
-Filezilla is also good, free and cross-platform
Steps:
- Open ftp software
- “Open Connection”
- Enter the following info:
servername: dtc-wsuv.org
username: first initial + last name + the year started(’18”) + @dtc-wsuv.org (so, “Sam Jones” would be “sjones18@dtc-wsuv.org”) – all in lowercase, no spaces or symbols!!
password: sent to your wsu email, can’t be changed! - If successful, you should be in your personal server directory that has the same name as your username. Now you can either drag the folder and files in that directory or use the “action” menu to “upload”
- Please upload folders with the following in all lowercase: “blackbird” for the blackbird project, “recipe” for the recipe project, etc. You can always change the folder and file names on the remote server, as you would on your desktop.
- Make sure that your default page for the project is “index.html”
- Check how everything looks on the live absolute URL:
http://dtc-wsuv.org/sjones18/blackbird/ - If you cannot see images, make sure that your file names and calls to access those files are all lowercase. Servers are case-sensitive!
- Email me that URL (wluers@wsu.edu)