Q: What is a DIV tag and how is it used?
The DIV element is use to divide and organize your web page.
Q: How do I close an <img> tag?
The IMG tag self-terminates: <img />
Q: What are the different types of images, and how are they each used?
Q: Why do I need to use a zip folder?
Zipped folders “lock” the contents of a folder together to make it easier to submit into Moodle in one piece.
Q: What is the main purpose of "floating" for a website?
The purpose of floating is to allow content to be side by side. Basically, it looks better. A website would be really lame if everything was just one straight line down the side. Floating content makes the website look more creative and streamlined.
Q: CSS consists of only 3 parts. What are they and how would you write a CSS rule?
They consist of:
selector {property: value}
Q: I have a hard time remembering all of the names for things.
There is a nice resource doc at the top of the course that has a bunch of elements and tags listed out for you. It can be really handy.
Q: I'm having a hard time remembering CLASS and ID tags.
With the class/ID tags, I remember that class can be used multiple times within the same XHTML because there is more than one class in a school. With ID, there's only one person with your identification, so there can only be one of the same ID in an XHTML. I remember the # and . the same way -- when you're writing/typing, you only include one # at once, but you're able to add multiple.
W3schools reference: http://www.w3schools.com/css/css_id_class.asp
Q: I am having a lot of trouble with the box model assignments.
Okay so, the box model is basically a way to better keep your website organized. Think of it like a bunch of boxes inside one another -- the biggest box is the margin. All of the other boxes (elements) go inside of it. So the margin is the largest box, it's the largest element on the website. It goes around everything else. It's like the space between the edge of the screen and then the content of the website. It's transparent. The next box would be the borders. You know what a border is -- these will use the background color unless you specify another one. The next box would be the padding -- this makes a space between the content and the border. Without it, the text would be squished right up onto the border. The next and smallest box is the content -- all the text and images and everything. The pixels and percentages and everything is how to make sure you size it right -- it's just simple math. When you're writing the code, you add in the height and width to the borders, padding, and everything right? So what you do is you add all of those together. To get the width you add all of the widths together -- the right border, left border, right padding, left padding, right margin and left margin. That's the total width. So for example...
div {margin: 20px; padding: 50px; border: 10px solid black;}The total width would be 160
You do the same thing to get the total height of an element, you just add the top border, bottom border, top padding, bottom padding, top margin and bottom margin. I hope that makes more sense!
W3schools reference: http://www.w3schools.com/css/css_boxmodel.asp
Q: I struggle most with how all of CSS works and how it can apply to every page (index, product, home, events). How does that work?
A single CSS file will work for all of your pages, as long as you link it in the header. Anything you change on the CSS file will affect every page (index, product, etc.) that has the link at the top. The code will look like this: <link rel="stylesheet" href="screen.css">
W3schools reference: http://www.w3schools.com/css/css_howto.asp
Q: I am having trouble with CSS float.
Okay so floating is basically a better and easier to way to make websites look better. It positions an element to the left or right, relative to other block-level elements. If you wanted to make a two column page, you would have to make sure that the total width of both elements you want floating next to each other is 100% or less. You can figure that out by using the box model.
W3schools reference: http://www.w3schools.com/css/css_float.asp
The DIV element is use to divide and organize your web page.
Q: How do I close an <img> tag?
The IMG tag self-terminates: <img />
Q: What are the different types of images, and how are they each used?
- JPG: Photographs, large or detailed images
- GIF: simple animations, charts, diagrams, line art, flat illustrations
- PNG: Alpha channels, gamma correction, two-dimensional interlacing
Q: Why do I need to use a zip folder?
Zipped folders “lock” the contents of a folder together to make it easier to submit into Moodle in one piece.
Q: What is the main purpose of "floating" for a website?
The purpose of floating is to allow content to be side by side. Basically, it looks better. A website would be really lame if everything was just one straight line down the side. Floating content makes the website look more creative and streamlined.
Q: CSS consists of only 3 parts. What are they and how would you write a CSS rule?
They consist of:
- selector
- property
- value
selector {property: value}
Q: I have a hard time remembering all of the names for things.
There is a nice resource doc at the top of the course that has a bunch of elements and tags listed out for you. It can be really handy.
Q: I'm having a hard time remembering CLASS and ID tags.
With the class/ID tags, I remember that class can be used multiple times within the same XHTML because there is more than one class in a school. With ID, there's only one person with your identification, so there can only be one of the same ID in an XHTML. I remember the # and . the same way -- when you're writing/typing, you only include one # at once, but you're able to add multiple.
W3schools reference: http://www.w3schools.com/css/css_id_class.asp
Q: I am having a lot of trouble with the box model assignments.
Okay so, the box model is basically a way to better keep your website organized. Think of it like a bunch of boxes inside one another -- the biggest box is the margin. All of the other boxes (elements) go inside of it. So the margin is the largest box, it's the largest element on the website. It goes around everything else. It's like the space between the edge of the screen and then the content of the website. It's transparent. The next box would be the borders. You know what a border is -- these will use the background color unless you specify another one. The next box would be the padding -- this makes a space between the content and the border. Without it, the text would be squished right up onto the border. The next and smallest box is the content -- all the text and images and everything. The pixels and percentages and everything is how to make sure you size it right -- it's just simple math. When you're writing the code, you add in the height and width to the borders, padding, and everything right? So what you do is you add all of those together. To get the width you add all of the widths together -- the right border, left border, right padding, left padding, right margin and left margin. That's the total width. So for example...
div {margin: 20px; padding: 50px; border: 10px solid black;}The total width would be 160
You do the same thing to get the total height of an element, you just add the top border, bottom border, top padding, bottom padding, top margin and bottom margin. I hope that makes more sense!
W3schools reference: http://www.w3schools.com/css/css_boxmodel.asp
Q: I struggle most with how all of CSS works and how it can apply to every page (index, product, home, events). How does that work?
A single CSS file will work for all of your pages, as long as you link it in the header. Anything you change on the CSS file will affect every page (index, product, etc.) that has the link at the top. The code will look like this: <link rel="stylesheet" href="screen.css">
W3schools reference: http://www.w3schools.com/css/css_howto.asp
Q: I am having trouble with CSS float.
Okay so floating is basically a better and easier to way to make websites look better. It positions an element to the left or right, relative to other block-level elements. If you wanted to make a two column page, you would have to make sure that the total width of both elements you want floating next to each other is 100% or less. You can figure that out by using the box model.
W3schools reference: http://www.w3schools.com/css/css_float.asp