Можно ли создать внешний svg файл с помощью css?

Можно ли создать внешний svg файл с помощью css без изменения содержимого файла svg?

И есть ли лучший способ отобразить внешний файл svg в html5?

Ответы

Ответ 1

Невозможно использовать тег img, они в основном похожи на растровые изображения в отношении доступа или изменения их. Вы можете использовать тег <iframe> со своим атрибутом стиля или вместо этого просто включить svg inline в файл, который вы можете сделать с помощью html5.

Ответ 2

Почти. Если вы можете встроить свой SVG непосредственно в свой HTML5-документ с помощью тега svg, вы можете создать его с помощью CSS, например:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <style type="text/css">
            #redcircle { stroke:black; stroke-width:5; }
        </style>
    </head>
    <body>
        <svg width="200" height="200" xmlns="http://www.w3.org/2000/svg">
            <circle id="redcircle" cx="50" cy="50" r="30" fill="red" /> 
        </svg>
    </body>
</html>