色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

css怎么內描邊

傅智翔2年前11瀏覽0評論

CSS怎么內描邊?

文字的描邊可以通過text-stroke屬性來實現,但是如果要內描邊這個屬性就不可用了。不過我們可以使用文字陰影(text-shadow)來模擬內描邊的效果。

代碼如下:

/* 文字內描邊 */
.text{
color: #000;
text-shadow:
-1px -1px 0 #fff,
1px -1px 0 #fff,
-1px 1px 0 #fff,
1px 1px 0 #fff;
}

以上代碼會為文字添加4個方向上的陰影,并且顏色都是白色,在視覺效果上達到了內描邊的效果。

另外,如果想要針對某個特定大小、粗細的文字添加內描邊,可以使用灰色文字疊加白色審美字體實現,代碼如下:

代碼如下:

/* 灰色文字疊加白色審美字體 */
.text{
color: #333;
position: relative;
display: inline-block;
}
.text::before{
content: attr(data-content);
position: absolute;
top: 0;
left: 0;
color: #fff;
text-shadow:
1px 0 0 #fff,
1px 1px 0 #fff,
0 1px 0 #fff,
-1px 1px 0 #fff,
-1px 0 0 #fff,
-1px -1px 0 #fff,
0 -1px 0 #fff,
1px -1px 0 #fff;
-webkit-text-stroke: 0.8px #333;
text-stroke: 0.8px #333;
}

以上代碼實現了更為復雜的內描邊效果,采用了前后文字疊加的方式,視覺效果更佳。

總結:

在CSS中實現內描邊需要使用text-shadow屬性進行模擬,或疊加不同顏色的文字實現。無論哪種方式,都可以實現美觀的內描邊效果。