HTML and CSS Flashcards

Which CSS at-rule is used to apply styles only when the viewport meets a specific condition such as minimum width?

Answer: @media

`@media` queries let you conditionally apply CSS rules based on device characteristics like viewport width, resolution, or orientation.

What is the semantic difference between `` and `` in HTML5?

Answer: conveys importance while is purely stylistic bold

`` carries semantic weight indicating the text is of strong importance, whereas `` only implies a stylistic offset with no added importance.

Which value of `display` makes an element behave like a block but allows setting width and height while keeping it inline?

Answer: inline-block

`display: inline-block` combines inline flow (sits alongside other inline elements) with block-level sizing (respects width/height).

What does CSS specificity determine?

Answer: Which rule wins when multiple conflicting selectors target the same element

Specificity is a weight calculated from the types of selectors used; the rule with the highest specificity overrides conflicting rules.

Which HTML element represents a navigation landmark containing primary site links?

Answer:

`` is a semantic landmark element intended for blocks of navigation links, aiding screen readers and SEO.

In CSS, what does `transition: all 0.3s ease` do?

Answer: Animates all changing CSS properties over 0.3 seconds using an ease timing function

The `transition` shorthand specifies the property, duration, and timing function for smooth state changes triggered by CSS changes.

What is the purpose of the `alt` attribute on an `` element?

Answer: It provides alternative text for screen readers and when the image fails to load

The `alt` attribute supplies a text description of the image used by assistive technologies and displayed when the image cannot be rendered.