HTML & CSS
What is an inline level element? What is an example?
An inline element does not start on a new line and only takes up as much width as necessary. Examples: <b>, <strong>, <span>
What is the purpose of the DOCTYPE declaration?
An instruction to the web browser about what version of HTML the page is written in. This must be the first thing in your HTML document, before the <html> tag.
What are the three form elements?
Input, textarea, select
What should the <article> element be used for?
Represents a self-contained composition in a document, page, application, or site, which is intended to be independently distributable or reusable (e.g., in syndication). This could be a forum post, a magazine or newspaper article, a blog entry, an object, or any other independent item of content.
What are three ways you can apply CSS to a webpage? In what order do those three ways take precedence?
i. Inline (highest precedence) ii. Internal or embedded iii. External (lowest precedence)
What two HTML elements will bold text? What is the difference in the two?
<b> and <strong>. Bold is simply about visual presentation of the text. Strong adds additional meaning that the text should be strongly emphasized
What two HTML elements will italicize text? What is the difference in the two?
<i> and <em>. Italic is simply about visual presentation in italics. EM adds additional meaning that the text has emphasis.
What is a block level element? What is an example?
A block-level element always starts on a new line and takes up the full width available (stretches out to the left and right as far as it can). Examples: <p>, <section>, <div>
How does method="get" process form data?
Appends the form data to the URL so that it is visible. This is great for non-secure data, like a Google search, because the user can bookmark the results that include the values entered in the form.
How does method="post" process form data?
Appends the form data within the HTTP request. Since the data is not shown, it is more secure.
How do you reference special () characters in HTML?
Character entities are used to display reserved characters in HTML. A character entity looks like either &entity_name; OR &#entity_number;. For example, a non-breaking space entity is nbsp; and a greater than symbol is >
What does the name attribute define for a link?
Defines an anchor location within a page. In this context it is intended to be a unique location on the page, so it has been replaced with using the ID attribute instead.
What does the type attribute do? Which type of form elements does it work with
Defines which type of input field displays on the page. It only works with the input element.
How do you identify a class selector in CSS? How do you apply it in HTML?
In CSS, the rule would look like this: .myClass{color:red;} In HTML you need to apply the class each time you wish to use it, like this: <section class="myClass">
How do you identify a tag selector in CSS? How do you apply it in HTML?
In CSS, the rule would look like this: section{width:500px} You do not need to do anything to apply this in HTML. It will apply any time you use the <section> element
What is the purpose of the <head> element? Where is it located?
It is a container for metadata about the page. This data is not displayed on the page. Metadata typically define document title, styles, links, scripts, and other meta information.
What options do you have to float an element?
Left, right, none, initial, inherit
How do you reference an internal/root relative link? When would you use this type of link?
References a path based on its location from the root level of the web server. Ex. href="/resume". Always begins with the forward slash to indicate that it should begin in the root level. This is useful when the file structure of your site is complex or complicated. This type of link only works on a web server, not on your local machine.
What should the <section> element be used for?
Represents a generic section of a document, i.e., a thematic grouping of content, typically with a heading.
How do semantic elements differ from other elements like <div> or <span>?
Semantic elements provide additional information about the type of content they contain. Div or span elements are generic containers used only for styling purposes and do not provide any context to their contents.
What does the title attribute do? Which type of form elements does it work with?
Specifies extra information about an element. The information is most often shown as a tooltip text when the mouse moves over the element. Can be applied to all HTML elements.
What does the clear attribute do?
Specifies on which sides of an element floating elements are not allowed to float. Let's say that I apply float to an image and the text around it will float along its left edge. If I want to stop the paragraph from wrapping around the image I would apply the clear to the paragraph. So the float is still applied to the image element, I'm just saying that the paragraph element will not be affected by the image's float.
What does the multiple attribute do? Which type of form elements does it work with??
Specifies that multiple options can be selected within a <select> element.
What does the value attribute do? Which type of form elements does it work with?
Specifies the value of the input. It works different with different input types. For example, a text field will show the value by default within the field but a button will display the value as the label on the button itself. This attribute works with both the input and options within a <select> element.
What does the size attribute do? Which type of form elements does it work with?
Specifies the visible width for an <input> element, or the number of options visible at one time in a <select> element.
How do you identify an HTML element? What identifies where it begins and where it ends?
The < and > brackets define an HTML element. It begins with the first mention of the tag, for example, <p>. The element closes with the closing tag, </p>. The forward slash in the element denotes it as the closing tag.
What does the src attribute do? How do you add the attribute in the code?
The image URL - or the path to get the image. <img src="myimage.jpg" />
What four values comprise the total width that an element displays at?
The space that something occupies on the screen is a total of its with + padding on each side + border on each side + margin on each side.
What are fixed positioning values placing an element in relation to?
They are in relation to the edges of the browser. These elements are taken out of the normal page flow and work independent from all other page content.
What are absolute positioning values placing an element in relation to?
They are in relation to the first parent container that does not have static/default positioning. If no parent element that meets that criteria is present they will work in relation to <body> element with the effect being that they appear to be based on the edges of the browser window. Unlike fixed elements, these will still "scroll" within the browser window with the rest of the content.
What are relative positioning values placing an element in relation to?
They are in relation to where the element would be in the normal page flow, before applying any type of positioning.
What are meta tags used for?
To include information about the webpage that is not visible to the user. This is information for the browser or search engine.
What does the action attribute determine?
Where the data is to be sent when the form is processed.
Do child elements inherit properties from their parent element?
Yes. All except the <a>
How do you reference a relative link? When would you use this type of link?
You reference a path from your current location to the file that you are seeking. Ex. href="resume.html". This is typically used within your site and makes it easy to transfer the location of your site without breaking links.
How do you reference an absolute link? When would you use this type of link?
You reference the full path to a file, for example, href="http://www.mysite.com/resume.html". You only use this when referencing a file that it outside of your own