ryanSmithART.com/courses/2015/fall


week#4

Talk about "Project A"
*Check Homework
2 webpages with at least 1 image and a working link

.zip files

REVIEW :

Center divs using CSS:
#wrap{
text-align:left;
max-width:1000px;
min-width:600px;
margin-left:auto;
margin-right:auto;
width:60%;
background-color:white;
padding:10px;
}

....... CSS3:

html{
height:100%;
overflow-y: scroll;
background: url(images/bg.gif) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}

Google fonts

ID vs. Classes

* CSS styles can be applied to general page elements, CSS Classes, and specific items: img { border: 0px; }
this applies to every image tag in the HTML document

.classy { color: red; }
this applies to a CSS class called classy.
<span class="classy" > Example of classy red text </span>

#about { background-color: #ccc; }
This rule applies to just the specific element that has an ID value of about:

<div id="about"> About stuff goes here </div>


changing the background with CSS

Example of good CSS positioning
Here's the CSS code
by Larry Ullman

div tags:
<div id="title"> week 4 </div>
<div id="other"> most of stuff </div>
<div id="scroller">--scrolling div section-----------</div>

CSS:
#title{
background-color:#000;
color:#FFF;
top:0px;
height:50px;
left:0px;
width:100%;
}
#other{
top:70px;
background-color:#FFF;
color:#999;
width:500px;
}
#scroller{
padding-left:10px;
background-color:#000;
color:#FFF;
width:100px;
height:50px;
overflow:scroll;
}




How the Web Works


Uploading to a Server (we might do this next week)

FUGU (FTP) Free Download
Step by step FUGU instructions(Towson)

1) Save your homework as index.html, then save it in a 365 folder in a Towson directory
2) Upload the 365 folder (with your images, and index.html page) to Towson's server
3) Check to make sure it worked: http://tiger.towson.edu/~username/365/index.html
*4) Email me a link to the URL address (now),
and if you can't get it uploaded email me your photo, and your HTML code
ryansmithstudent@aol.com

HOME WORK (due at the beginning of class, next week)

KEEP WORKING ON "PROJECT A"

this week:
- make your webpages look better
- finish a rough draft (that means completed html pages w/ css)

- SEP. 25th: have a rough draft finished (that means completed html pages w/ css)

NOTE: failure to have a rough draft turned in (1 week before the due date), will result in a 10% drop in your project grade