website:
ryanSmithArt.com/2024
WEEK #1
[jan. 30, 2024]
...let's try turning off our phones for a bit :)
youTube/...Relaxing Music for Stress Relief
*Go over syllabus*
DOWNLOAD:
BB Edit
or
Brackets
HTML basics:
READING:
* HTML INTRODUCTION
* HTML BASIC
* HTML ELEMENTS
* HTML ATTRIBUTES
Look at page1.html
* HTML HEADINGS
* HTML PARAGRAPHS
Some more HTML:
<!-- this is a comment in HTML -->
<a href="http://www.website.com"> Link to a webpage </a>
<a href="..." target="_blank">Link to a webpage </a>
Relative links:
- refer to a page that exists in the current directory that the browser points to.
• sub-directories and included files can be specified in the relative link.
• Makes for very portable web pages. Whole directory systems [websites/projects] can be moved easily.
Remote links:
- reference files based on the absolute location on complete URL:
Example: https://users.cs.cf.ac.uk
- CSS -
*PLEASE, USE EXTERNAL STYLE SHEETS
WE WILL TALK MORE ABOUT CSS STYLES NEXT WEEK *
***External Style Sheets
<link href="466.css" rel="stylesheet" >
HOMEWORK:
You will be assigned a CSS style (background color, font size, etc.).
Using an external style sheet, you will teach the rest of the class how to apply that style to an HTML page.
CSS Questions:
1. How do you change the background color of a webpage?
2. How do you change the font color of “Body Text”?
3. How do you change the font color of headers: H1, H2, etc?
4. How do you change font sizes?
5. How do you change the background color of a paragraph?
6. What is padding, and how do you add it to a paragraph of text?
7. How do you add a solid border to your images?
8. What's a margin, and how do you add it to your images?
9. How do you change the color of your hyperlinks ("A" tags), and how do you change the "visited link" color?
10. What's the difference between an "active" link color and a "hover" color? How do you apply these CSS styles to HTML Links.
11. How do you change the font family, and why would you want to choose more than 1 font family?
12. What is "line height", and how would you adjust it using CSS?
13. What's the difference between a DIV Class, and an ID?
14. How would you center text and/or an image?
15. How do you change the background color of a DIV box?
16. How would you change the margins and padding of a DIV (using a class)?
17. Why would you use "span" tags, and can you use them to change your font color?
18. How do you add comments, or notes to yourself using CSS? And, why would you use comments?
19. What are "Google Fonts", and how do you add them to your page (using CSS code)?
20. How do you adjust the opacity of your CSS styles?