7

スタイル入力ボックスをグーグルで検索してみました。しかし、私はinput:focusで立ち往生しています。コードは http://jsfiddle.net/GmgUZ/の下にあります

  input:hover{
    border-bottom-color: #B9B9B9;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-left-color-ltr-source: physical;
    border-left-color-rtl-source: physical;
    border-left-color-value: #B9B9B9;
    border-left-style-ltr-source: physical;
    border-left-style-rtl-source: physical;
    border-left-style-value: solid;
    border-left-width-ltr-source: physical;
    border-left-width-rtl-source: physical;
    border-left-width-value: 1px;
    border-right-color-ltr-source: physical;
    border-right-color-rtl-source: physical;
    border-right-color-value: #B9B9B9;
    border-right-style-ltr-source: physical;
    border-right-style-rtl-source: physical;
    border-right-style-value: solid;
    border-right-width-ltr-source: physical;
    border-right-width-rtl-source: physical;
    border-right-width-value: 1px;
    border-top-color: #A0A0A0;
    border-top-style: solid;
    border-top-width: 1px;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
    }

  input[type="text"]:focus {
  border:1px solid #4D90FE;
  -webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) inset;
  -moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) inset;
  box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) inset;

    }

どんな洞察も大歓迎です!

4

2 に答える 2

13

input#gText:focus の代わりに使用input[type="text"]:focusして追加outline: none;

input#gText:focus {
border:1px solid #4D90FE;
-webkit-box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) インセット;
-moz-box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) インセット;
box-shadow:0 1px 2px rgba(0, 0, 0, 0.3) インセット;
アウトライン: なし;
}

デモ:
http://jsfiddle.net/GmgUZ/1/

于 2012-06-17T08:11:09.837 に答える