https://scegob.github.io/week8CSSCodingProjectEnviornmentalScience/
Coding Steps: Style the website you made last week using CSS.
Below are the requirements:
a. Use only external CSS file (no internal or inline styling)
b. Every element must be styled
c. Create style rules using class, id, and element selectors
This project carries on from the week 7 assignments HTML project, "I decided to simulate freelancing by building a website for my enviornmental science professor to use as a resource for students to prep for the midterm and in the future I will add more so that students can prepare for the final. This project has taught me alot about the inner workings of a website and building projects in the real world and hopefully I can build more projects in the future for clients."
I learned a lot about how CSS works and what it takes to make a stylized website. There are three ways to implement CSS into your html file. First is inline style which is written inside the html tag. Second in internal style which is written inside of a <style></style> tag. finally third is external style and it is written in it's own file and linked to a html file. I learned that there are 4 types of selectors, first is class selectors wwhich can be used as many times as you like and are denoted with a period (.). Second is ID selector which works just like the class selector but it can be used only once and are denoted with a pound sign (#). Third is element selector which adds style to the element and is denoted by the element name, example (p, div, body). Finally is the universal selector which people use to change the default set by the browser itself. Css also has specificity with inline being the most important and will override the others. The next is the id selectors. Next are Class Selectors, attribute selectors, and pseudo-classes(:hover). With the lowest specificity being Type Selectors ( h1) & Pseudo-elements (::Before). Something important to remember in CSS is the box model which includes the margin, border, padding and content. Content: The content of the box, where text and images appear. Padding: Clears and area around the content. The padding is transparent. Border: A border that goes around the padding and the content. Margin: Clears an area outside the border. The margin is transparent.