html - 特定 Angular 的边框半径在移动设备上不起作用

Question

我正在尝试使用border-radius-top-left等，但是当我在手机上查看页面时，它会将其视为只是边框半径并将其应用于所有 Angular 。当我在桌面上查看它时，它工作正常。

.container {
    display: inline-block;
    float: left;
    width: calc(90vw - 20px);
    margin: 0 5vw;
    background: rgba(255,255,255,0.05);
    font-size: 15px;
    color: #ffffff;
    height: 40px;
    padding: 0 10px;
    outline: none;
    margin-top: 25px;
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
    border: 1px solid rgba(255,255,255,0.25);
}

不确定这是否相关，但 CSS 正在应用于 <input> .

Answer 1

没关系，可能您使用的是旧版本的浏览器，它不支持 border-radius-top-left 等。

但要确保添加此行:

border-radius: 0;  // Add this line
border-top-left-radius: 3px;
border-top-right-radius: 3px;