智睿软件_技术交流论坛综合站长Web页面设计 → [推荐]建站页面html图片按钮多种写法


  共有18875人关注过本帖树形打印

主题:[推荐]建站页面html图片按钮多种写法

帅哥哟,离线,有人找我吗?
zhirui
  1楼 个性首页 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:管理员 帖子:520 积分:8740 威望:0 精华:5 注册:2009-07-07
[推荐]建站页面html图片按钮多种写法  发帖心情 Post By:2012-04-17 11:27:17

1: 在一般情况下按钮提交表单:
<form id="form1" name="form1" method="post" action="index.html"> 
<input type="submit" name="button" id="button" value="提交" />
</form>
这样提交按钮是标签 <input type="submit">,如果想换成图片加上样式,把value="提交" 改成value=" "(这样“提交”两个字就不会显示在这张背景图片的上面):
#button
{
background:url(eeo_2.jpg) no-repeat;
width:100px;
height:50px;
border:0px;
cursor:pointer;
}
2:直接使用图片标签按钮
<form id="form1" name="form1" method="post" action="index.html">
<input name="submit" type="image" value="ee" src="eeo_2.jpg" />
</form>
直接写在html页面上就能直接看到按钮是图片的!
3:由于上面第二种图片直接使用 “src”链接,但是如果一个网站很多需要到表单图片按钮展示的话,这样就会增加网页显示的速度!之前说过如果把全部类型差不多的图片整合成一张,每个页面使用css+div调用同一张图片里面的不同个按钮图标图片,这样的话便能更优化代码以及网站。
<form id="form1" name="form1" method="post" action="index.html">
<input name="submit" type="image" value="ee" src="eeo_2.jpg" />
</form>
样式:
button
{
background:url(eeo_2.jpg) no-repeat -54px -35px;
width:100px;
height:50px;
border:0px;
cursor:pointer;
}

政府公安政府系统,专注于政府媒体,公安公众信息系统 支持(0中立(0反对(0回到顶部
帅哥哟,离线,有人找我吗?
zhirui
  2楼 个性首页 | 信息 | 搜索 | 邮箱 | 主页 | UC


加好友 发短信
等级:管理员 帖子:520 积分:8740 威望:0 精华:5 注册:2009-07-07
  发帖心情 Post By:2012-05-03 09:40:18

var c;

修改这个就行了,详细参数如下:

0xffffff:文字颜色| 2:文字位置| 0x009900:文字背景颜色| 50:文字背景透明度| 0xffffff:按键文字颜色| 0xff0000:按键默认颜色| 0x009900:按键当前颜色| 3:自动播放时间(秒)| 2:图片过渡效果| 1:是否显示按钮| _blank:打开新窗口

颜色都以0x开始16进制数字表示

文字颜色:标题的颜色

文字位置:0表示在图片顶端,1表示在图片底部,2表示在浮动在图片顶端

文字背景透明度:0-100值,0表示全部透明[只对文字位置为2时有效]

按键文字颜色:按键数字颜色

按键默认颜色:按键默认的颜色

按键当前颜色:当前图片按键颜色

自动播放时间:单位是秒

图片过渡效果:0,表示亮度过渡,1表示透明度过渡,2表示模糊过渡,3表示运动模糊过渡

是否显示按钮:0,表示隐藏按键部分

打开窗口:_blank表示新窗口打开。_self表示在当前窗口打开


企业开源网站管理系统,中小型企业的成长伙伴 支持(0中立(0反对(0回到顶部