Q
How can you reference an external SVG file within an HTML document for displaying an icon?

Answer & Solution

Answer: Option B
Solution:
External SVG files are referenced and displayed in HTML using the <use> element with the SVG file path and the desired icon's ID.
Related Questions on Average

What is the purpose of using SVG sprite sheets for icons in web development?

A). Combine multiple SVG icons into a single file for performance

B). Embed SVG icons directly into HTML for faster loading

C). Use inline SVG code for flexibility

D). Increase file size for better quality

Which attribute is used in SVG <use> elements to reference a specific icon within an external SVG file?

A). xlink:href

B). src

C). href

D). file

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

A). Code reusability and maintenance

B). Increased file size

C). Inline styling options

D). Compatibility issues

Which CSS property is commonly used to style SVG icons in HTML documents?

A). fill

B). background-color

C). border

D). text-decoration

What is the advantage of using CSS for styling SVG icons instead of inline styles?

A). Easier maintenance and consistent styling

B). Better compatibility with older browsers

C). Faster loading times

D). Increased file size

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

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

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