現(xiàn)在有一個(gè)矩形框,高度小于寬度 .half { border: 10px solid black; height: 200px; width: 400px; margin-left: 900px; border-radius: 55px; background: yellow; }現(xiàn)在設(shè)置的是固定高度,垂直半徑和水平半徑都是55px,可以得到我要的效果,垂直方向上有一段110px長度的固定高度不參與倒圓角但是現(xiàn)在這個(gè)矩形高度變?yōu)榭勺兓?而border-radius支持百分?jǐn)?shù),但是百分?jǐn)?shù)相對(duì)的是邊框的長度,水平半徑相對(duì)的是水平邊框的長度,垂直半徑相對(duì)的是垂直邊框的長度,使用calc(50% - 55px),這樣水平半徑是不等于垂直半徑的現(xiàn)在的做法是使用js設(shè)置,能不能通過css也可以實(shí)現(xiàn)這個(gè)效果
css border-radius 怎么保持水平半徑等于垂直半徑
慕森王
2019-03-12 14:19:26