リンクをクリックした後に表示される点線の枠を消す
aタグなどのリンクをクリックした後に表示される点線の枠について。これが残っているとちょっとデザイン的によろしくないですよね。CSSに少し加えるだけで消すことができます。
a,a:focus {
outline:none;
}
button,input,input:focus {
outline:none;
}
input::-moz-focus-inner,
button::-moz-focus-inner {
border:none;
}
※firefoxは挙動が違うため、::-moz-focus-innerの指定で制御します。
リセット用のCSSに書いておけば便利ですね
categories
- WordPress（61）
- JavaScript（49）
- Vue.js（48）
- CSS（46）
- jQuery（34）
- Nuxt.js（22）
- Sass（21）
- Gulp（17）
- webpack（16）
- PHP（14）
- HTML（14）
- GSAP（11）
- React（10）
- Vite（9）
- Pug（9）
- Laravel（8）
- Cordova（8）
- Linux（7）
- Next.js（6）
- Apache（5）
- Shopify（4）
- REST API（4）
- Node.js（4）
- Smarty（3）
- Git（3）
- JSON（3）
- その他プログラミング（3）
- Google Apps API（3）
- Bootstrap（3）
- 環境構築・システム（3）
- TypeScript（2）
- EJS（2）
- RMS（2）
- Docker（2）
- Instagram API（2）
- Excel VBA（2）
- SVG（1）
- Dart（1）
- ECカートASP（1）
- Markdown（1）
- AMP（1）
- Nginx（1）
- XML（1）
- shellscript（1）
- Ruby（1）
- MySQL（1）
