Recall & Review
beginner
What is a global style in Svelte?
A global style in Svelte is CSS that applies to the whole app or page, affecting all components unless overridden. It is declared using the <style> tag with the global attribute or placed in a separate CSS file.
Click to reveal answer
beginner
How does Svelte scope styles by default?
By default, Svelte scopes styles to the component by adding unique attributes to elements and CSS selectors. This means styles inside a component's <style> tag only affect that component's HTML.
Click to reveal answer
beginner
How do you write a global style inside a Svelte component?
You add the global attribute to the <style> tag like this:
<style global>. Styles inside this tag apply globally, not just to the component.Click to reveal answer
intermediate
What is one advantage of scoped styles in Svelte?
Scoped styles prevent CSS conflicts by isolating styles to a component. This helps keep styles predictable and easier to maintain, especially in large apps.
Click to reveal answer
intermediate
When might you prefer global styles over scoped styles in Svelte?
Global styles are useful for setting base styles like fonts, colors, or layout rules that should apply everywhere. They are also good for third-party CSS or utility classes.
Click to reveal answer
In Svelte, how do you make styles apply globally from inside a component?
✗ Incorrect
Adding the 'global' attribute to the