CSS - 将文本阴影与文本轮廓相结合?

Pan*_*nic 6 html css css3 box-shadow

我正在努力做到这一点(不介意红色背景)在此输入图像描述

所以这就是我得到的东西,我可以在文本周围找到边框但是我不能将它与文本阴影结合起来......我怎么能绕过这个?也许这是:before :after陈述的东西?

h1, h2 { 
    font-family: Chicago;
    font-size: 38px;
    color: #FFFFFF;
    letter-spacing: 1.73px;
    
    
    

    /*
    text-shadow: 0 0 5px #000000; 
    
    THIS WILL GIVE THE TEXT THE SHADOW*/
    
    text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
    /*THIS WILL GIVE THE TEXT THE BORDER*/
    
    /*How can I combine these two?*/
}
Run Code Online (Sandbox Code Playgroud)
<h1>CSS ZEN GARDEN</h1>
<h1>THE BEAUTY OF CSS DESIGN</h1>
Run Code Online (Sandbox Code Playgroud)

小智 4

也许这个解决方案就是您正在寻找的:

h1 {
   -webkit-text-stroke: 1px black;
   color: white;
   text-shadow:
     3px 3px 5px #000,
     -1px -1px 5px #000,  
     1px -1px 5px #000,
     -1px 1px 5px #000,
      1px 1px 5px #000;
}
Run Code Online (Sandbox Code Playgroud)
<h1>CSS ZEN GARDEN</h1>
<h1>THE BEAUTY OF CSS DESIGN</h1>
Run Code Online (Sandbox Code Playgroud)