Day 4
- Take Home Review
- Images
- Logos
- Float and Clear
- Daily Challenge
- Code Editors vs IDEs
- Project Directories
- Wireframes
- Take Home Challenge
- Questions?
- Image Tag
- Image Formats
- Creative Commons vs Royalty Free vs GPL
- Image Resources
- Free Image Editor
- What is a Logo?
- Free Logo Makers:
- *account required
- Try it: Create a logo
- Float Property
- Clear Property
- Use them together (Video)
- Block Formatting Context
- Problems with Floats
- were originally intended for image alignment
- were not intended to be use to create layouts, at the time there weren't many options to create complex layouts so people got creative
- today we have better and simpler alternatives like
flex(1-dimension) orgrid(2-dimensions) layouts (not covered in this course)
- Using the Visual Studio Code File from your take home challenge:
- Add a logo to the left side of your navbar
- BONUS: Hyperlink your logo
- Save your work
- Right click your code > "Open with Live Server" to view your work in the browser!
- project-name (root folder)
- |- css/
- |- style.css
- |- img/
- |- image.jpg
- |- image2.jpg
- |- js/
- |- script.js
- |- about.html
- |- contact.html
- |- index.html
- |- css/
- Create a wireframe for your final project