CSS Basics

Question 2

What is CSS?

Answer 2

Cascading Style Sheets. A language developed to control the presentation of markup language documents.

Question 3

What are style sheets?

Answer 3

collection of formatting rules

Question 4

In CSS cascade means?

Answer 4

styles are applied to pages in the order they are found

Question 5

What are some benefits of user control (users overriding the styles)?

Answer 5

Enhances accessibility. Prevents rendering issues from restricting access to content. Users with disabilities can override smaller text sizes. On the web being able to access content matters more.

Question 6

what is syntax?

Answer 6

arrangement of words and phrases to create well-formed sentences in a language

Question 7

parts of CSS Syntax

Answer 7

Selector
Declaration
Property
Value

Question 8

what is a css selector?

Answer 8

patterns used to select the element(s) you want to style

Question 9

what is a css decleration?

Answer 9

formatting instructions enclosed in curly braces

Question 10

css declaration rule

Answer 10

property: value;

Question 11

whitespaces?

Answer 11

Important within a selector. not important in declarations.

Question 12

good way to learn css syntax?

Answer 12

focus on basic elements first. explore thee css specifications. read through css from other sites.

Question 13

universal selector

Answer 13

• matches any element
  ex: * { property:value;}

Question 14

what is element type selector?

Answer 14

global selector matches elements with the corresponding element type name. they are case insensitive in HTML but are case sensitive in XML. -ex: p {declarations;}

Question 15

what is class selectors?

Answer 15

they are HTML attributes that can be set on any HTML element and can be used on as many elements and as many times as needed. -ex: .className {declarations}

Question 16

what is ID selectors?

Answer 16

HTML attributes that can be set on any HTML element and must be unique to the page. -ex: #idSelector {declarations}

Question 17

what is element-specific selectors?

Answer 17

modified class or ID selector which limits application to a specific element -ex: h2.subheading {declarations} or div#sidebar {declarations}

Question 18

class & ID naming conventions

Answer 18

no whitespace or special characters. CSS is case-sensitive. establish standards for your CSS and stay consistent with them.

Question 19

Descendent Selectors

Answer 19

Highly specific selectors that target elements based on their location within other elements. -ex: div p span {declarations}

Question 20

Grouping Selectors

Answer 20

Allows you to group selectors together that share formatting. separated by comma.

Question 21

tips for structure

Answer 21

start with well-structured HTML. use meaningful classes and IDS. use consistent HTML structure.

Question 22

Guidelines for Writing HTML

Answer 22

Focus on writing clean efficient code. Structure the HTML so that it adds meaning to the content. Don’t focus on styling when initially structuring code.

Question 23

Style Locations

Answer 23

Three options: External style sheet. Embedded Style. Inline Style.

Question 24

Authoring Considerations

Answer 24

Most projects will rely heavily on external styles. Embedded styles are mainly used to overwrite external styles. You should plan on overall site strategy for style replacement.

Question 25

How Browsers Read Selectors

Answer 25

right to left -ex: #mainContent div p span {declarations} : browser will first find all the span in the document then eliminate the ones that are not within p tag etc.

Question 26

The Cascade

Answer 26

no matter where the styles are found the last rule applied wins. Styles are applied in the order they are found.

Question 27

Inheritance

Answer 27

some values are inherited by the children of an element in the document tree.

Question 28

Specificity

Answer 28

is a way to describe how specific a rule is. if cascade or inheritance resolves a conflict then the more specific rule wins.

Question 29

Rendering Engine

Answer 29

aka web browser engine or layout engine. it is a software component laying out the content.

Question 30

Common Rendering Engines

Answer 30

Trident (IE AOL) Presto (Opera) Gecko (Firefox) WebKit(Safari Chrome)

Question 31

Web Standards

Answer 31

Web Standards Project / W3C / Mozilla Foundation

Question 32

Importance of Standards

Answer 32

ensures consistent design and user experience across multiple browsers