Поведение строковых литералов сбивает с толку

Один из способов, который работает в большинстве современных браузеров (кроме края), хотя и с черным фоном, заключается в использовании

background: black;
color: white;
mix-blend-mode: multiply;

в вашем текстовом элементе, а затем поместить любой фон, который вы хотите позади что. Умножение в основном отображает код цвета 0-255 в 0-1, а затем умножает его на то, что стоит за ним, поэтому черный остается черно-белым, умножается на 1 и эффективно становится прозрачным. http://codepen.io/nic_klaassen/full/adKqWX/