css不用图片美化按钮
.tb{width:100%;height:1px;overflow:hidden;background:rgb(250,100,0);margin:0 1px;}
.lr{width:100%;height:20px;overflow:hidden;border-left:1px solid rgb(250,100,0);border-right:1px
solid rgb(250,100,0);}
.bg{width:100%;height:20px;overflow:hidden;}
.button{position:relative;width:100%;height:20px;top:-20px;font-
size:9pt;border:0;background:none;}
function rgb(){
ID=arguments[0]
oRGB=eval(arguments[1])
nRGB=eval(arguments[2])
var IMG=""
for(i=20;i>0;i=i-2){
RGB="rgb("+(oRGB[0]-1)+","+(oRGB[1]-1)+","+(oRGB[2]-1)+")"
IMG+=""
}
for(i=20;i>0;i=i-2){
RGB="rgb("+(nRGB[0]-1)+","+(nRGB[1]-1)+","+(nRGB[2]-1)+")"
IMG+=""
}
eval(ID+".innerHTML=IMG")
}
rgb("bg",[255,180,20],[255,140,20])
button.onmouseover=function(){rgb("bg",[255,200,20],[255,160,20])}
button.onmouseout=function(){rgb("bg",[255,180,20],[255,140,20])}
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相关推荐
-
css不用图片美化按钮
.tb{width:100%;height:1px;overflow:hidden;background:rgb(250,100,0);margin:0 1px;} .lr{width:100%;height:20px;overflow:hidden;border-left:1px solid rgb(250,100,0);border-right:1px solid rgb(250,100,0);} .bg{width:100%;height:20px;overflow:hidden;} .b
-
JQuery+CSS实现图片上放置按钮的方法
本文实例讲述了JQuery+CSS实现图片上放置按钮的方法.分享给大家供大家参考.具体分析如下: position:relative日常应用的时候一般是设置给position:absolute;的父层的, 父层position:relative; 子层position:absolute;的话, 就是依照父层的边界进行定位的, 不然position:absolute 会逐层向上寻找设置了position:relative的元素边界, 直到body元素.. 第一种写法(连同CSS一起追加进去) va
-
CSS网页布局入门教程11:带当前标识的标签式横向导航图片美化版
虽然完成了标签式导航,但是广场状的导航似乎并不能够顺应现在的设计潮流,其实导航不仅可以使用css的颜色来定义,同样可以采用精心设计的图片或其它元素来构建导航,在这里我们将开始改善导航的设计,使它成为更加出色的标签效果. 我们将考虑去掉单一的方块状背景元素,使用带色彩的圆角标签来完成我们的设计.不过从这个改进中能够体会到css设计的另一个优势,就是可以不需要修改结构代码,只需要修改样式,便可以完成改进,所以这里可以直接看看css代码的设计: <style> body { background-c
-
MFC实现漂亮界面之美化按钮
上次我们学习了如何美化对话框的界面,这次我们为上次的对话框添加两个按钮,一个是关闭按钮,另一个是最小化按钮,好,现在我们先看一下效果: 是不是很难看,因为我们的对话框美化了,所以我们的按钮也要美化,因为采用贴图的方式来美化,所以,我先给出这两个按钮的PNG格式的图片,该图片支持透明色,具体如下: 关闭按钮效果图: 最小化按钮效果图: 这两张效果图是我自己从网上找的,可能不是很合适,但是用来教学,完全没有问题,它们的尺寸都是108*21,每张图片都有四个小图片,第一张和第四张小图片都是透明的,所以
-
Ajax清除浏览器js、css、图片缓存的方法
做东东时都是把图片在服务器的地址存放在数据库里面,然后到浏览器中显示,但是后来发现了两个问题. 第一:为了安全起见,js是无法读取本地的图片的,不然你写一个js,岂不是可以获取任何人电脑里面的文件了. 第二:图片存在的是在服务器的硬盘上面,而不是在客户的硬盘里面,所以也是取不到的 后来在网上找方法,找的方法,都是各种转换二进制到xml中,的各种高大上的答案,然后本人又实在太懒了,就自己想了一个 方法,就是利用BufferedImage这个类. 开始 首先说说我的思路,就是把本地的图片,加载到内存
-
div+css实现自适应宽度按钮
先来看张图片: 原理就是通过背景的左对齐和右对齐用A标签和span标签组合出一个完整的圆角矩形.再通过hover标签去滑动图片.而你只需要一张图片: ok,看看代码吧. CSS: 复制代码 代码如下: *{margin:0; padding:0;} body{padding:10px; font-size:12px;} h1{margin:0; padding:10px 0; font-size:14px; font-weight:bold;} a{background:url(1.
-
js+css实现回到顶部按钮(back to top)
本文实例介绍了js+css实现回到顶部按钮的方法,分享给大家供大家参考,具体内容如下 效果 html <p id="back-to-top"><a href="#top"><span></span></a></p> css p#back-to-top{ position:fixed; bottom:100px; right:80px; } p#back-to-top a{ text-align:
-
CSS控制图片大小-适应宽度
不知道家有没有遇到过这样的情况:在CSS控制图片大小时,如果把图片的宽度写死,比如 img{width:500px;} ,固然,如果图片宽度大于500px可以很好的控制它不让它过大,但如果图片宽度小于500px,比如说只有100px时,刚才的写法会把这张图扩大5倍显示,显然,这不是我们想看到的. 那么,CSS如何可以区分对待这些图片设置大小呢?很简单,请看: 复制代码 代码如下: img{width:expression(this.width>500?"500px":this.w
-
css配合jquery美化 select
一个简单的css配合jq美化select 复制代码 代码如下: <div id="main"> <section id="basic-usage"> <select id="basic-usage-demo"> <option value="">请选择-</option> <option>1</option> <option>2
-
使用Bootstrap美化按钮实例代码(demo)
在HTML5中,按钮的常用属性主要为背景颜色和大小 demo代码演示 一. input标签: <input type="button" value="按钮" class="btn"/> 二. button标签:(这里用button标签举例) <button type="button" class="btn btn-defult">提交</button> btn 表示基本样
随机推荐
- AngularJS Bootstrap详细介绍及实例代码
- IOS网络请求之NSURLSession使用详解
- 如何使用PHP对网站验证码进行破解
- 基于mysql的bbs设计(四)
- 总结Android中MD风格相关控件
- mysql获取随机数据的方法
- 一些不标准的东西,不过还是有点用处
- Ajax轮询请求状态(微信公众号带参数二维码登录网站)
- 利用adt-bundle轻松搭建Android开发环境与Hello world(Windows)
- jquery 打开窗口返回值实现代码
- Android编程单击图片实现切换效果的方法
- javascript实现确定和取消提示框效果
- Apache启动提示错误undefined symbol: libiconv_open解决方法
- C#视频转换类分享
- C#圆角窗体简单实现方法
- C语言中fgetgrent()函数和fgetpwent()函数的用法对比
- MySql获取某个字段存在于哪个表的sql语句
- IIS .7z文件支持下载的添加方法
- 细看网络仿真工具
- 浅谈Docker运行Tensorboard和jupyter的方法