?一 說明

? ? ? ? 應項目要求，調整ant design tour 彈窗邊框的樣式。tour 原本樣式是有遮罩層，因此沒有邊框看起來也不突兀。原圖如下：

但是UI設計是取消遮罩層，并設置邊框樣式。當?取消 了遮罩層，沒有設置邊框樣式的圖片如下：

由上可以看出，不設置邊框的tour似乎跟網頁頁面融合了在一起。因此，就需要設置邊框。?設置后的效果如下：

二 實現方式

? ? ? ? ?最初我試著直接去修改ant design的內部css樣式，修改 .ant-tour 的css 樣式，但是始終不生效。于是，在反復觀看官方文檔，發現有一個全局token可以用來設置邊框樣式，那就是：

?因此，設置代碼如下：

    <ConfigProvidertheme={{token: {boxShadowTertiary: " 0px 4px 16px 0px red"},}}><Tour open={true} mask={false} steps={step}/></ConfigProvider>