如何在IonInput字段中禁用蓝色边框线?

时间:2019-07-11 09:55:59

标签: html css

我想在IonicV2的IonInput中禁用蓝色边框线。

我尝试从网上添加一些CSS,但是id不起作用

<ionlist 
    id="list" 
    nolines 
    style="margin-top:150px;margin-bottom:15px" 
    visible
>
    <ionitem 
        id="usernameItem" 
        detail="none" 
        wraptext="false" 
        sticky="false" 
        type="default" 
        style="display:flex;position:relative;top:0px;bottom:0px;border-top:1px none rgb(222, 222, 222);border-bottom:1px none rgb(0, 0, 0);height:68px"
    >
        <ioninput 
            id="username" 
            style="display:flex;border-bottom:1px solid rgb(225, 39, 39)" 
            label="Username" 
            labelposition="floating" 
            type="username"
        ></ioninput>
    </ionitem>
    <ionitem 
        id="passwordItem" 
        type="default" 
        style="border-top:1px none rgb(0, 0, 0);border-bottom:1px none rgb(222, 222, 222)" 
        detail="none" 
        wraptext="false" 
        sticky="false"
    >
        <ioninput 
            id="password" 
            style="display:flex;border-bottom:1px solid rgb(225, 39, 39)" 
            labelposition="floating" 
            label="Password" 
            type="password"
        ></ioninput>
    </ionitem>
</ionlist>

实际上,第二个ionInput字段没有显示蓝色边框线,但我不知道为什么

1 个答案:

答案 0 :(得分:0)

我会尝试删除离子输入的轮廓。只需将outline: none添加到特定元素(在本例中为ioninput)。