Skip to content

Commit

Permalink
Added Reference to CSS quesitons (yangshun#79)
Browse files Browse the repository at this point in the history
* Added reference to CSS question: What is the difference between classes and IDs in CSS?

* Added reference to CSS question: Explain CSS sprites...

* Update interview-questions.md
  • Loading branch information
alexprut authored and yangshun committed Oct 26, 2017
1 parent a5da8b8 commit df43d84
Showing 1 changed file with 8 additions and 0 deletions.
8 changes: 8 additions & 0 deletions front-end/interview-questions.md
Original file line number Diff line number Diff line change
Expand Up @@ -200,6 +200,10 @@ Answers to [Front-end Job Interview Questions - CSS Questions](https://github.co
- **IDs** - Meant to be unique within the document. Can be used to identify an element when linking using a fragment identifier. Elements can only have one `id` attribute.
- **Classes** - Can be reused on multiple elements within the document. Mainly for styling and targeting elements.

###### References
- https://www.w3.org/TR/CSS1/#id-as-selector
- https://www.w3.org/TR/CSS1/#class-as-selector

### What's the difference between "resetting" and "normalizing" CSS? Which would you choose, and why?

- **Resetting** - Resetting is meant to strip all default browser styling on elements. For e.g. `margin`s, `padding`s, `font-size`s of all elements are reset to be the same. You will have to redeclare styling for common typographic elements.
Expand Down Expand Up @@ -294,6 +298,10 @@ CSS sprites combine multiple images into one single larger image. It is commonly
- Reduce the number of HTTP requests for multiple images (only one single request is required per spritesheet). But with HTTP2, loading multiple images is no longer much of an issue.
- Advance downloading of assets that won't be downloaded until needed, such as images that only appear upon `:hover` pseudo-states. Blinking wouldn't be seen.

###### References

- https://css-tricks.com/css-sprites/

### What are your favorite image replacement techniques and which do you use when?

CSS image replacement is a technique of replacing a text element (usually a header tag like an `<h1>`) with an image (often a logo). It has its origins in the time before web fonts and SVG. For years, web developers battled against browser inconsistencies to craft image replacement techniques that struck the right balance between design and accessibility.
Expand Down

0 comments on commit df43d84

Please sign in to comment.