css 描边文字

Posted 2021-05-13

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"}

// alert('Hello world!');

<h1>CSS</h1>

<h1><svg overflow="visible" width="2em" height="1.2em"><use xlink:href="#css" /><text id="css" y="1em">CSS</text></svg></h1>

/**
 * Stroked text
 */

h1 {
	margin: 0;
	color: white;
}

h1:first-child { text-shadow: 1px 1px black, -1px -1px black, 1px -1px black, -1px 1px black; }

h1 text { fill: currentColor }
h1 use {
	stroke: black; 
	stroke-width: 6;
	stroke-linejoin: round;
}

body {
	background: deeppink;
	font: bold 200%/1 Rockwell, serif;
}