Question

CSS可否改变设置按钮的样式？怎么做呢？菜鸟求教~

>.<我是按书上教的做的样子

稍后附图

比如这个按钮，HTML代码是：
<input name="f_server_cx"type="submit"id="f_server_cx"tabindex="6"value=""/>
CSS代码是：
#f_server_cx{
background-image:url(首页-buttoncxxx.png);
background-repeat:no-repeat;
margin-top:20px;
width:211px;
height:61px;
margin-left:20px;
border-bottom:1px solid #666666;
}

显示效果就是一个最标准的按钮的形状，表面替换成了图片。

我想要只要那个图片成按钮的形状。

再问：这种方法和直接做链接改成按钮，有啥区别？？

谢谢
怎么能做出DW中预览的这种效果呢？？？
【图片请点击查看，即可看清】

Answer 1

1、首先创建一个txt文件，修改后缀名：把.txt改为.html，用记事本打开添加如下代码：打开浏览器，这是一个没有添加样式的button，外观不美观，而且在不同的浏览器下显示的外观是不一样的，所以我们要添加统一的样式。

2、按钮样式比较多，这样写让代码不整洁，可阅读性差，就要用style标签。

3、<style type="text/css"></style>样式表。style标签里面表示的是一个样式表，我们所有的样式都可以写到标签中去。这段代码的意思是：凡是button标签都使用这个样式。

4、把 样式表中的  button{}改成了.ui_button{}，然后在button标签里面加了class属性，这样做的意思是，这个button标签使用了名字为ui_button的样式。

5、通过javascript动态修改样式，为了避免用户多次点击提交按钮重复提交信息，在用户点击提交按钮之后，禁用按钮，并设置按钮字体的颜色为灰色。

6、修改样式的其他方法：obj.style.cssText = "color:#E1E1E1;background-color:black;";cssText可以写多个样式样式属性。

7、修改样式的其他方法：obj.setAttribute("class", "style2");直接更改按钮标签的class属性，把指向名为ui_button的样式改为指向名为style2的样式。

8、修改样式的其他方法：<link href="css1.css" rel="stylesheet" type="text/css" id="css"/>obj.setAttribute("href","css2.css");修改引用外部的样式表文件，这样就可以对整个页面的样式进行全部更新。

Answer 2

<input type="submit" value="登陆" class="button" />
.button{width:38px;height:18px;line-height:18px;border:0;margin:4px 0 0 10px;background:url(../images/tx54header_bg.gif);}
把border调成0

Answer 3

或者直接用图片：

<img src="1.jpg" width="80" height:"25" onClick="javascript:document.form1.submit();"/>

"form1"为form表单的名称

Answer 4

<button class="btn"></button>

.btn{display:block;width:100px;height:20px;background:url(xxx.gif) no-repeat 0 0}

Answer 5

是的，就是一背图。