如何直接設置邊界半徑選定方向的水平值分量？

Question

MDC：

甲border-radius具有每方向2個值，一個是水平 值和一個是垂直值。

如何設置一個選擇方向的水平值（假設選擇的方向是border-top-left-radius），而不影響垂直價值，反之亦然？

需要明確的是，假設這是啓動狀態：

border-top-left-radius:  1em 2em; 
border-top-right-radius: 3em 4em; 
border-bottom-right-radius: 5em 6em; 
border-bottom-left-radius: 7em 8em; 

我如何結束狀態：

border-top-left-radius:  100em 2em; 
border-top-right-radius: 3em 4em; 
border-bottom-right-radius: 5em 6em; 
border-bottom-left-radius: 7em 8em; 

我想不出」只是style.borderTopLeftRadius="100em 2em";，因爲我不知道事先說垂直分量是2em。

我想過的一種方法是使用style.borderTopLeftRadius來讀取當前的邊界左上角半徑，並執行一些字符串解析來確定是否設置了垂直值，如果是，則提取該值。

當然，我正在尋找一個更好的解決方案，而不是嘗試分析字符串。基本上我正在尋找像這樣的東西：style.borderTopLeftRadiusHorizontal="100em";

Answer 1

你剛剛回答你自己的問題嗎？要設置邊框半徑100em，請將該值設置爲100em。我很困惑你想問什麼。

border-top-left-radius:  1em 2em; 
border-top-right-radius: 3em 4em; 
border-bottom-right-radius: 5em 6em; 
border-bottom-left-radius: 7em 8em; 

在這個代碼塊中，這兩個值分別對應於水平和垂直半徑。在這個例子中，左上角的水平半徑爲1em，垂直半徑爲2em。更改任一值都不會影響其他值。

border-top-left-radius:  10em 2em; 

這仍然具有2em的垂直半徑。

我注意到在你原來的例子中你使用了100em作爲一個值 - 你需要確保你應用這個的元素足夠大，使得100em顯得有價值。