Q
What is the purpose of using external SVG files for icons in web development?

Answer & Solution

Answer: Option A
Solution:
Using external SVG files for icons promotes code reusability and easier maintenance, as the same icon can be used across multiple pages without duplicating code.
Related Questions on Average

What is the recommended approach for optimizing SVG icons for web use?

A). Minimize file size, remove unnecessary code, and optimize paths

B). Increase file size for better quality

C). Use inline styles for all SVG elements

D). Embed external CSS files into SVG

What is the advantage of using SVG icons over raster images in web design?

A). Scalability without loss of quality

B). Larger file sizes

C). Limited color options

D). Incompatibility with HTML5

How can you make SVG icons accessible to users with disabilities?

A). Include <title> and <desc> elements for descriptions

B). Use JavaScript for interactive accessibility

C). Increase icon size for better visibility

D). Embed external images into SVG

How can you apply CSS styles to an SVG icon referenced using the <use> element?

A). Apply styles directly to the <use> element

B). Apply styles to the referenced SVG file

C). Apply styles to the <svg> element containing the <use> element

D). Apply styles to the parent container of the <svg> element

How can you embed an inline SVG icon directly into an HTML document?

A). Using the <svg> element

B). Using the <img> element

C). Using the <div> element

D). Using the <span> element

What is the purpose of using external CSS stylesheets for SVG icons?

A). Centralized styling, easier maintenance, and consistent design

B). Increased file size and slower loading times

C). Inline styling options

D). Compatibility with non-SVG formats

How can you create a hover effect for an SVG icon using CSS?

A). Apply :hover pseudo-class to the SVG element

B). Use JavaScript for hover effects

C). Add a <hover> attribute to the SVG icon

D). Apply a class on hover using JavaScript

How can you ensure cross-browser compatibility when using SVG icons with CSS?

A). Test SVG icons across different browsers and versions

B). Include vendor prefixes for CSS properties

C). Use polyfills for unsupported CSS features

D). Convert SVG icons to raster images

Which attribute of SVG sprite <symbol> elements is used to define a unique ID for each icon within the sprite sheet?

A). id

B). name

C). class

D). label

How can you animate an SVG icon using CSS animations?

A). Define animation keyframes and apply them to the SVG icon

B). Use the animate element within the SVG file

C). Apply JavaScript code for animations

D). Use external animation libraries