首页前端开发CSScss 去除 未选择任何文件

css 去除 未选择任何文件

时间2023-11-13 08:36:03发布访客分类CSS浏览106
导读:CSS 去除未选择任何文件::-webkit-file-upload-button { visibility: hidden;} ::-moz-file-upload-button { visibility: hidden;} ::be...

CSS 去除未选择任何文件

::-webkit-file-upload-button {
      visibility: hidden;
}
 ::-moz-file-upload-button {
      visibility: hidden;
}
 ::before {
      content: "请选择文件";
      display: inline-block;
      background: #007bff;
      color: #fff;
      padding: 8px 20px;
      outline: none;
      white-space: nowrap;
      -webkit-user-select: none;
      -moz-user-select: none;
      -ms-user-select: none;
      user-select: none;
      cursor: pointer;
      border-radius: 4px;
      font-size: 14px;
      font-weight: normal;
      border: none;
}
 :active::before {
      background-color: #0062cc;
}
 :disabled::before {
      background-color: #6c757d;
      cursor: not-allowed;
}
    

上述样式通过修改文件上传按钮的外观,实现了去除未选择任何文件时的提示。其中,::-webkit-file-upload-button::-moz-file-upload-button 分别代表处理 Webkit 内核和 Firefox 浏览器的按钮;::before 为伪元素,在按钮前面添加提示文字,当按钮被点击时更改背景颜色。

声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!


若转载请注明出处: css 去除 未选择任何文件
本文地址: https://pptw.com/jishu/537164.html
css 去除图片之间的建个 css怎么做复杂的高度计算

游客 回复需填写必要信息