Одним из ключей к пониманию файлов SVG является осознание того, что они не похожи на другие, распространенные форматы файлов изображений. Это язык разметки, более похожий на HTML и XML. Это источник вашего SVG-файла:
<!-- This Source Code Form is subject to the terms of the Mozilla Public - License, v. 2.0. If a copy of the MPL was not distributed with this - file, You can obtain one at http://mozilla.org/MPL/2.0/. --> <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16"> <path fill="context-fill" fill-opacity="context-fill-opacity" d="M6 14a1 1 0 0 1-.707-.293l-3-3a1 1 0 0 1 1.414-1.414l2.157 2.157 6.316-9.023a1 1 0 0 1 1.639 1.146l-7 10a1 1 0 0 1-.732.427A.863.863 0 0 1 6 14z"/> </svg> Это pathутверждение - ваша галочка. d=Атрибут инструкция, которые определяют форму галочки. Думайте об этом как о совершенно прозрачном (невидимом) куске стекла. Стекло существует ... но ты его не видишь. Вы можете почувствовать это и его форму ... но вы должны сделать больше, чтобы сделать это, чтобы вы могли видеть эту форму.
Здесь у вас нет атрибута инсульта. Штрих определил бы линию вокруг внешнего края формы. Мы можем определить ширину обводки (насколько толстой будет линия), ее цвет и другие свойства. Не сделав этого ... однако ... нет никакой линии вокруг нашей невидимой стеклянной формы ... поэтому она остается невидимой.
У нас есть свойства заполнения ( fill=и fill-opacity=). Заливка определяет цвет и содержание поверхности вашей фигуры. Однако для свойств заполнения установлено значение context-fillи context-fill-opacity. Контекстное заполнение является нестандартной функцией. Вероятно, он будет поддерживаться более новой версией основных браузеров (я лично тестировал ее с новейшими версиями Edge, Firefox и Chrome) ... однако нет никаких гарантий, что она будет поддерживаться программами просмотра и редактирования изображений, которые с большей вероятностью оставаться ближе к стандартам. Любое приложение, которое не поддерживает эту функцию, может просто игнорировать ее полностью.
И это твоя проблема. У вас нет удара ... и в приложениях, которые не поддерживают заполнение контекстом, у вас нет заполнения. Это оставляет вас с этими невидимыми кусочками стекла. Это там ... вы просто не можете видеть это.
