CSS中的字體樣式有很多種，其中中間鏤空的字體就是一種比較特別的樣式，在一些特定的場合下會更加適用。

h1 {
font-size: 80px;
position: relative;
}
h1:before {
content: "";
text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
height: 100%;
border: 4px solid white;
box-sizing: border-box;
border-radius: 10px;
}
h1:after {
content: attr(data-text);
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
color: white;
text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8);
mix-blend-mode: difference;
font-weight: bold;
}

中間鏤空的字體使用的原理是利用:after和:before偽元素。其中:before元素用于創建一個白色的鏤空背景，并設置邊框和圓角，以此達到中間鏤空的效果。而:after元素則用于顯示真實的文案，并且使其具有白色的字體顏色和黑色的陰影。

經過配合和調整，中間鏤空的字體就可以達到一個很好的效果，非常適合用于一些個性化的場合中，如建筑公司的標志、時尚雜志的標題等等。