Today’s Goals:
- Consider joining the MHS Vision Committee– it needs students’ perspectives!
- Finish your CSS Quote project– directions here
- Fill out this this quick evaluation form about your CSS Quote
- Review HTML and CSS
- Learn how to create a color gradient background– directions here
Today’s featured website:
- https://codepen.io/alvaromontoro/pen/MWWKKMN – Only CSS is used (no JavaScript!) in this Whack-a-Mole game
What You Learned 1st Quarter:
- How the internet works, web hosting, and domain registration
- What browsers are and built-in tools to help with web development
- Basic HTML– how to set up a basic webpage, how to add images, links, text
- Computer and internet security basics
- Basic CSS– how to add a background image and color, how to change the text font, color, and size, how to add a text-shadow
- How to use a text editor like Notepad++
- Where to find high quality, free stock images
- How to edit images using Pixlr.com
- Basic graphic design techniques
- What WordPress is and how to use it
- How to add a web font like Google Fonts to your website
- Where your work is published: on class website, school website, and school social media
- 1st quarter survey: click here!
HTML and CSS Review
- Your Questions?
- What are your HTML and CSS questions?
- HTML
- What are the 4 important HTML tags we need to use every time we set up a webpage?
- What content goes in the head section? What about the body section?
- Tricky tags– link, image, anything else?
- CSS
- Where does CSS code go on your webpage? Head or body section?
- Find and define selectors, properties, and values. See https://www.w3schools.com/css/css_syntax.asp.
- Should CSS ever go in your body section?
- We use pointy brackets < > with HTML. We use curly brackets { }, colons : and semi-colons ; with CSS. Find those now on your keyboard.
- Copying/Pasting Code
- Be careful! What do we have to watch out for?
- Copying links– what needs to change? What about images?
- Copying CSS– where does it go? What needs to change?