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 表示基本样
随机推荐
- asp 延时 页面延迟的三种方法
- 抓住用户碎片时间推广 一天突破10000+流量
- Java实现按行读取大文件
- JavaScript中如何使用cookie实现记住密码功能及cookie相关函数介绍
- 详解Python中的序列化与反序列化的使用
- 上一篇,下一篇过程代码
- Docker学习之常用的基础命令总结
- PHP自定义函数获取搜索引擎来源关键字的方法
- 理解javascript async的用法
- 页面的缓存与不缓存设置及html页面中meta的作用
- 详解webpack2+React 实例demo
- 智能监测自动重启Apache服务器的Shell脚本
- linux shell之文件锁
- js仿拉勾网首页穿墙广告效果
- 解决IIS中应用程序池提供服务的进程无法响应Ping或进程关闭时间超过了限制
- 隐私 注册表“密”而不宣
- IIS下还原备份xml配置文件的方法
- Android开发之超强图片工具类BitmapUtil完整实例
- android使用PullToRefresh框架实现ListView下拉刷新上拉加载更多
- React+Spring实现跨域问题的完美解决方法