クリックやタップするとなぞの青い枠や四角が。。
いろいろ調べたら、消せるらしいので、その時の備忘録。
クリックしたときの青い枠線
buttonやinputをクリック・フォーカスしたときに、
なぞの青い枠線が出てきたけど、色があってなくて、消したい。。
その場合は、outline
を設定するとよいらしい。
*:focus { outline: none; }
タップしたときの青い四角
スマホでボタンやリンクをタップすると、
押したことが分かるように選択した要素が青く光る。
色があってなかったり、別で指定したりするので無効化したい。。
tap-highlight-color
というらしく、透過させると無効化できるらしい。
a { -webkit-tap-highlight-color:rgba(0,0,0,0); cursor:pointer; }
cursorがpointerじゃないと効かないらしいので、合わせて設定。
また、Androidは無効化だけだけど、iOSだとハイライトカラーを変えれるらしい。
以上!!