OIM3690 - Web Technologies

2025 Fall

Session 05 (9/09)

contain

Today's Agenda

Welcome/News/Announcements

  • Homework 1 (Due 9/19)
  • Communications:
    • Meet with me in person during office hours at least once this semester.
    • Email - specify course # in subject title, e.g., "OIM3690: GitHub settings"

What we have learned so far...

  • HTML
    • basic tags
    • images
    • links
  • CSS
    • Three types of CSS:
      • External CSS
      • Internal CSS
      • Inline CSS
    • What if there is conflict?
  • Checkout HTML Vocabulary and CSS Vocabulary

Debugging Practice

  • p {font-size:18;}

  • p {font:arial;}

  • img{
  margin-top: 10px;
  margin-bottom: 20px;
  margin-top: 30px;
}

  • img{
  float: left;
}
img{
  border-color: red;
}
img{
  border-width: 5px;
}

GitHub Issues for Feedback

  • All feedback will be provided in the GitHub Issues section of your OIM3690 repo.
    • You should receive email from GitHub when a new issue is posted.
    • Regularly check the Issues section on your GitHub repository.
    • Reply if further discussion is needed.
    • Reply with evidence and close the issue if you believe it is resolved.
  • If you have any question on class content/demo code in OIM3690/WebTech,

CSS Basic: The Box Model

Find Box Model in Chrome Developer Tools

  • Open Web Developer Tools (F12 / or Ctrl + Shift + I)
  • Select the Inspector tab
  • Select an element in the HTML structure
  • Check the Layout tab on the right

Lecture

--- # Happy **Groundhog Day**! * Try: Google "*[groundhog day](https://www.google.com/search?q=groundhog+day)*" ![bg right:45% 95%](https://media.giphy.com/media/j8sVwJid3NdjG/giphy.gif)