chrome button按钮点击之后会有蓝色边框

2017-10-09

问题： chrome button按钮点击之后会有蓝色边框

为了更好的用户体验，chrome浏览器默认会为当前获得焦点的button添加outline属性（一个带颜色的边框），这样可以方便用户使用tab键更换当前焦点按钮。怎么去除这种效果呢？

解决方法

如果想要去掉这种效果，可以在css中添加样式

1
2
3

button:focus {outline:none;}
//或者
button:focus {outline:0;}

其它浏览器，比如Firefox也会有类似的行为.如果想要去除，需要使用Mozilla的私有属性：
1
2
3
::-moz-focus-inner {border-color: transparent;}
// 或
::-moz-focus-inner {border:0;}

另外：此种方式对初始化的元素生效，对js中创建的元素是否生效待测试

缺失模块。
1、请确保node版本大于6.2
2、在博客根目录（注意不是yilia根目录）执行以下命令：
npm i hexo-generator-json-content --save

3、在根目录_config.yml里添加配置：

  jsonContent:
    meta: false
    pages: false
    posts:
      title: true
      date: true
      path: true
      text: false
      raw: false
      content: false
      slug: false
      updated: false
      comments: false
      link: false
      permalink: false
      excerpt: false
      categories: false
      tags: true

爱前端、爱小说、爱音乐、爱产品、爱游泳、爱动漫、爱家务、爱安静、爱萧萧。人生这么短，且行且努力。