CS 347: Lab 4 – Adding Style
Dear students:
Welcome to lab. Now’s your chance to apply the ideas you read about. Find a partner and complete as many of the tasks below as you can. At the end of our time together, paste your HTML files into Crowdsource in order to receive credit.
Task 1
Recreate the following page using an internal stylesheet:
Use this raw text:
Back to C
December 17, 2019
It is the first day of winter break. My mother encouraged me to keep my brain from wasting away and handed me this book on the C programming language that she used in college:
https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcSqZNa7W2NRoJpsA-60lQZd3GKPn8pyEck3oo1bJtb0QfHoFgAv
I read the book cover to cover. All one needed back in the day was to install a compiler. Mom had it easy. She'd freak out if I showed her node_modules. Perhaps someday computing will be simple again. But I think there's a law somewhere that says technological complexity will only increase.
Once I finished, I wrote my first C program. Here it is:
#include <stdio.h>
int main(int argc, char **argv) {
printf("Hello, world!\n");
}
I will never write another. Here's to a lifetime of learning!
Task 2
Use the HTML entities for the chess symbols to reconstruct a chessboard that looks like this using only HTML and CSS:
The blue-ish background color appears on the body.
Task 3
Create a specimen book like the kind that are used by the type industry to market fonts. Choose a random selection of text and present the text repeatedly, with each instance in a different color, style, and typeface. Use Google Fonts or some other font service.
TODO
The next step of your learning is to complete the following tasks:
- Read the chapter Box Model in All Over the Web.
- Start working on the first project: a static website made of HTML and CSS.
- Research some aspect of web development on your own. Find articles and videos beyond what’s assigned. Summarize what you learn in a couple paragraphs of your own words and with a code sample in your next blog entry before Friday morning. Clearly put the date of the blog entry on your index page.
We don’t work on the same schedule, so encounter issues earlier rather than later.
See you next time.
