用css美化select框
先上代码:
.selectData{
height: 0.42rem; position: absolute;
right:.28rem;
top:.30rem;
//去边框
border: none;
outline: none;
//圆角
-moz-border-radius:0.5rem;
-webkit-border-radius:0.5rem;
border-radius:0.5rem; background-color: #003366;
select{
border: none;
outline: none;
line-height: 0.40rem;
//通过padding-left的值让文字居中
padding-left:0.1rem;
background: none;
color: #ffffff; font-style: normal;
font-weight:bold;
}
option{
border: none;
outline: none;
background-color: #003366;
color: #ffffff;
font-weight:bold;
}
}
思想就是
用css美化select框的更多相关文章
- 只用CSS美化选择框
只用CSS美化选择框 2012-03-02 11:04 by iBlog, 26240 阅读, 14 评论, 收藏, 编辑 <本文译自Style a Select Box Using Only ...
- css美化select标签,兼容ie10 ie10+,chrome。但不支持ie9 ie9-
让ie9 ie9+ 和非ie的浏览器加载这个hack.ie8,ie8- 就用自己的默认样式 <!-- email:416960428@qq.com author:李可 --> <!- ...
- jquery美化select,自定义下拉框样式
select默认的样式比较丑,有些应用需要美化select,在网上找到一个很好的美化样式效果,本人很喜欢,在这里分享一下. <!DOCTYPE html PUBLIC "-//W3C/ ...
- 用纯css改变下拉列表select框的默认样式(不兼容IE10以下)
在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 事情是这样的,您的设计师团队向您发送一个新的PSD(Photoshop文档),它是一个新的网站的最终设计 ...
- 用纯css改变下拉列表select框的默认样式
http://ourjs.com/detail/551b9b0529c8d81960000007 在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 问题的提出 事 ...
- 纯css改变下拉列表select框的默认样式
下列CSS就可以解决,原理是将浏览器默认的下拉框样式清除,然后应用上自己的,再附一张向右对齐小箭头的图片即可. select { /*Chrome和Firefox里面的边框是不一样的,所以复写了一下* ...
- [转载]用纯css改变下拉列表select框的默认样式
在这篇文章里,我将介绍如何不依赖JavaScript用纯css来改变下拉列表框的样式. 问题的提出 事情是这样的,您的设计师团队向您发送一个新的PSD(Photoshop文档),它是一个新的网站的最终 ...
- 用纯css改变下拉列表select框的默认样式(转)
用纯css改变下拉列表select框的默认样式 分享到 分类 JS学习 关键字 前端 发布 kris 2015-04-01 注意 转载须保留原文链接,译文链接,作者译者等信息. 在这 ...
- 点击盒子选中里面的单选框,并给盒子添加相应样式,美化单选框、复选框样式css用法,响应式滴
pc效果图: 移动端效果图: 代码直接上: <!DOCTYPE html> <html> <head> <meta http-equiv="Cont ...
随机推荐
- 数据结构实验之查找一:二叉排序树 (SDUT 3373)
二叉排序树(Binary Sort Tree),又称二叉查找树(Binary Search Tree),也称二叉搜索树. #include <stdio.h> #include <s ...
- Java基础系列 - 抽象类,子类继承
package com.company; /** * 抽象类继承 * 用abstract修饰类就是抽象类 * 用abstract修饰方法就是抽象方法(一般使用比较少) * 抽象类不能被实例化 */ p ...
- エンジニア死滅シタ世界之学べない学校 [MISSION LEVEL: C]-Python3
答案 # coding: utf-8 # 自分の得意な言語で # Let's チャレンジ!! N=input() w_a=0 w_b=0 gpc_dict={ "gg":0,&qu ...
- Vue——路由:登录状态的判断
在搭建的系统中,最基本的登录都是必须的,结合Vue的路由,涉及最多的就是登录状态的判断.也就是说,如果一个组件要校验登录状态,则在用户初始进入时,就要去判断用户是否登录,这里的校验登录状态就是本篇的重 ...
- 通过adb操作安卓亮屏、设置背光亮度、解锁、打开app
亮屏 adb shell inputkeyevent 26 keyevent 26表示点击power Android adb 点亮和关闭屏幕的命令 # kernel休眠 echo mem > / ...
- 《你不知道的JavaScript(上)》笔记——this全面解析
首先要理解调用位置: 调用位置就是函数在代码中被调用的位置(而不是声明的位置). 最重要的是要分析调用栈(就是为了到达当前执行位置所调用的所有函数). 我们关心的调用位置就在当前正在执行的函数的前一个 ...
- 关于form与表单提交操作的一切
原文链接:http://caibaojian.com/form.html 你知道,一个表单里面只要有form元素,如果没有给action加一个默认值,为空白的时候,当你刷新页面时,会弹出一个警告框提示 ...
- myeclipse打开jsp后卡死的问题详解
myeclipse打开jsp后卡死的问题详解 1,打开 Window -> Preferences -> General -> Editors -> File Associ ...
- 一秒 解决 ERROR 1044 (42000): Access denied for user ''@'localhost' to database 'mysql 问题
提示:ERROR 1044 (42000): Access denied for user ''@'localhost' to database 'mysql'.前两天也出现过这个问题,网上找了一个比 ...
- python基础之:九步认识装饰器
step1. 先看个代码吧: def f(): ') f=lambda a:a +100 #覆盖上面的函数f print(f) #函数名指函数所在内存中的位置,入带后面括号表示执行函数 print(f ...