1.改变滚动条的样式

.orderList::-webkit-scrollbar {/*滚动条整体样式*/
width: 4px; /*高宽分别对应横竖滚动条的尺寸*/
height: 4px;
}
.orderList::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
border-radius: 5px;
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: rgba(0,0,0,0.2);
}
.orderList::-webkit-scrollbar-track {/*滚动条里面轨道*/
-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
border-radius: 0;
background: rgba(0,0,0,0.1);
}

2.消除input的默认样式

  input, button, select, textarea {
    outline: none;
    -webkit-appearance: none;
    border-radius: 0;
  }

3.改变input,textarea的placeholder的样式

  input::-webkit-input-placeholder, textarea::-webkit-input-placeholder { 
    color: #fff;

    font-size:16px;
  } 
  input:-moz-placeholder, textarea:-moz-placeholder { 
    color: #fff;

    font-size:16px;

  } 
  input::-moz-placeholder, textarea::-moz-placeholder { 
    color: #fff;

    font-size:16px;
  } 
  input:-ms-input-placeholder, textarea:-ms-input-placeholder { 
    color: #fff;

    font-size:16px;
  }

关于前端滚动条,input框等样式的修改的更多相关文章

  1. 消除input框的默认样式

    input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...

  2. 前端获取文件input框的美化操作

    前面我们说了一种利用input框和js的当时获取本地文件内容的情况-详细信息参考 2017年11月8日前端用js获取本地文件的内容 以上方式获取的按钮是系统默认的显示,有时候我们需要对按钮的外观进行美 ...

  3. input框改变默认样式

      input[type="radio"] { width: 2rem; height: 2rem; -webkit-appearance: none; /*清除复选框默认样式*/ ...

  4. input选择框默认样式修改

    input选择框是无法直接修改样式,我们只能间接来改变它样式. 原理:用图片来代替原来的input选择框,原来的input选择框定位到图片上方并让它opacity为0,鼠标点击时用js来改变图片,这样 ...

  5. 替换input单选框的样式

    实现效果:. css的input单选框的样式很丑,有时候不想使用原生的样式,如上照片,可以使用下面的方法. 思路是,给inpu加visibility:hidden隐藏,然后使用不同的图片绝对定位覆盖在 ...

  6. 小实例---关于input宽度自适应以及多个input框合并拆分

    前两个月,公司内部需要开发关于大数据方面的辅助工具语料分词系统,在这个项目中遇到以下几个主要问题,在此分享~ 一.input宽度根据内定文本宽度自适应 背景:项目需求中,前台展示,需要从后台获取的.t ...

  7. jQuery实现input框输入值动态搜索

    我们在平时的前端开发中,经常会遇到添加数据,如果在添加之前要指定某个用户或对象进行关联,那在实现上要比普通的添加要繁琐一点.我本来的想法是给一个iframe,在 里面显示所有的数据并提供一个筛选的功能 ...

  8. js自定义修改复选框单选框样式,清除复选框单选框默认样式

    之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...

  9. 定制 input[type="radio"] 和 input[type="checkbox"] 样式

    表单中,经常会使用到单选按钮和复选框,但是,input[type="radio"] 和 input[type="checkbox"] 的默认样式在不同的浏览器或 ...

随机推荐

  1. aiohttp的笔记之TCPConnector

    TCPConnector维持链接池,限制并行连接的总量,当池满了,有请求退出再加入新请求.默认是100,limit=0的时候是无限制 1.use_dns_cache: 使用内部DNS映射缓存用以查询D ...

  2. 关于VC工程编译不过去这件事

    刚开始接触VC的时候,很大一部分时间是在对付编译链接错误,因为经验不足的原因,这些编译链接总让人很沮丧.比如: 1.fatal error LNK1104: 无法打开文件“LIBC.lib”错误 这个 ...

  3. hibernate框架学习之一级缓存

    l缓存是存储数据的临时空间,减少从数据库中查询数据的次数 lHibernate中提供有两种缓存机制 •一级缓存(Hibernate自身携带) •二级缓存(使用外部技术) lHibernate的一级缓存 ...

  4. [IOI2000] 邮局

    ## 非常神仙的 wqs 二分优化dp,又学了一招. 首先我们需要先想到一个人类智慧版的前缀和优化. # part 1:violence 然鹅在前缀和优化之前我们先考虑暴力做法:我们可以枚举 i . ...

  5. maven:打包时报错,报’找不到符号’

    参考文章:https://www.cnblogs.com/kelly-one/p/7349930.html 问题描述: 工程开发调试都没有问题,就是不能导出WAR包,用mvn clean packag ...

  6. 22)django-中间件

    一:中间件介绍 django 中的中间件(middleware),在django中,中间件其实就是一个类,在请求到来和结束后, django会根据自己的规则在合适的时机执行中间件中相应的方法. 在dj ...

  7. python中的各种锁

    一.全局解释器锁(GIL) 1.什么是全局解释器锁 在同一个进程中只要有一个线程获取了全局解释器(cpu)的使用权限,那么其他的线程就必须等待该线程的全局解释器(cpu)使 用权消失后才能使用全局解释 ...

  8. Protobuf3 语法指南

    目录 [−] 定义一个消息类型 指定字段类型 分配标识号 指定字段规则 添加更多消息类型 添加注释 保留标识符(Reserved) 从.proto文件生成了什么? 标量数值类型 默认值 枚举 使用其他 ...

  9. idea 去除xml文件sql语句背景色

    怎么看idea mapper.xml中写sql语句的那种屎黄屎黄背景颜色不好看 去除背景色 把这两项勾选去掉,然后 把这个背景勾选也去掉,最后 把这个勾选也去掉 另一种方式: 也可以使用这种方式 al ...

  10. 2018 github热门项目

    github流行的几个项目,我们来学习一下. 1. developer-roadmap-chinese image.png 项目简介:2018年web程序员路线中文版, 这个仓库里包含了一些前端,后端 ...