CS 328 - Week 4 Labs - 3:00 lab - 2016-02-12
* CS 328 - security - part 1!
* no matter HOW well you design your forms
on the client tier,
on the application tier,
DON'T TRUST DATA SUBMITTED BY USERS!!!!!!!!!!!!
* if a user can insert executable code into
that data they submitted,
and if it gets inserted such that it
can be executed elsewhere,
that's one form of CROSS-SITE SCRIPTING
* basically, you NEVER display, store, etc.
UNMODIFIED or UNCHECKED EXTERNAL INPUT from
USERS --
you want to check it, sanitize it, strip
elements from it, etc.
...more on this later, when we are programming
at the application tier;
Intro to CSS (using CSS3)
* goals:
* learn the fundamentals of CSS
* to be able to use it to layout forms
without (mis-)using tables
* HTML is supposed to be about STRUCTURING your CONTENT
CSS - Cascading Style Sheets -- is about DISPLAY
and how it LOOKS;
* Cascading style sheets describe the
appearance, layout, and presentation
of information on a web page
* ...a style sheet describes HOW information
is to be displayed, NOT *WHAT* is being
displayed;
* CSS1 - 1st CSS specification - dates back to 1996
(see more CSS history in course text, p. 51)
* where does CSS go?
THREE possible places:
* INLINE style sheet - goes in an individual
HTML element within a style attribute
* INTERNAL style sheet - goes in a style
element within a document's head element
v the PREFERRED approach!!!!
* EXTERNAL style sheet - goes in a plain
text file whose name has the suffix .css,
and is referenced within a link element
within a document's head element
* why are external style sheets preferred?
* separates PRESENTATION from CONTENT
* MUCH easier to manage;
* basic CSS syntax (and terminology):
* a CSS - for example, a .css file -
contains one or more RULES
* a RULE is the fundamental unit of CSS --
specifies a set of elements,
and a set of styles to apply to those elements
* each RULE consists of one or more SELECTORS
describing the element(s) the rule applies to,
followed by a list of PROPERTIES and their
values for styling those elements
* basic syntax:
selector
{
property: value;
property: value;
...
}
p
{
font-family: "Trebuchet MS";
color: red;
}
* (if a property's value contains a
blank, you need to surround it by quotes)
* property names are always lowercase
* more CS 328 COURSE STYLE:
* 1 property per line,
* YES I want the { } as shown above
(each on own line, even with the
selector)
* YES I want the properties indented
by at least 3 spaces
* CSS comments: /* I am a comment */
* Cascading order
* all of the style sheets of a document
"cascade" into a virtual style sheet
for that document, based on cascading
order;
1. Browser defaults
2. External style sheet
3. Internal style sheet
4. Inline style sheet
(and if you have multiple link elements
to multiple external style sheets,
the styles are applied in the order
of those link elements)
* Here's the version of the link element
that we'll be using in CS 328:
<link href="cssFileURL.css" type="text/css"
rel="stylesheet" />
* put JUST CSS rules (and comments)
in your .css external style sheets!!!
...these are plain text files!
...and they should have the suffix .css
(DON'T put HTML in .css files!)
* you can group selectors into a single rule
by separating them with commas
* (more CSS syntax is discussed in
328lab04-2.css)