请教个关于调用CSS方式的问题

stanley8315 2007-12-24 02:39:05
<input type="reset" value="重置" class="button" />
页面中有这么一个reset按键
a.shortButton
{
display:block;
background-color: transparent;
background-image: url(images/short-button.jpg);
background-repeat: no-repeat;
width: 63px;
height: 19px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
CSS中设置有这么一个属性,那么我该如何把这个a的属性用在这个input上呢,是否有办法呢,请指教下。
...全文
104 11 打赏 收藏 转发到动态 举报
AI 作业
写回复
用AI写文章
11 条回复
切换为时间正序
请发表友善的回复…
发表回复
cloudgamer 2007-12-24
  • 打赏
  • 举报
回复
lz不要太转牛角尖了
stanley8315 2007-12-24
  • 打赏
  • 举报
回复
好的 ,谢谢你耐心的回答了。
西安风影 2007-12-24
  • 打赏
  • 举报
回复
a.shortButton, .button
yixianggao 2007-12-24
  • 打赏
  • 举报
回复
如果是 a.shortButton 的形式很困难,除非用js遍历那个样式,
否则没戏,不过用脚本代价太大了,没必要!

所以说css也要设计!很明显现在滴问题是楼主滴css设计出现了问题!
就用3楼滴方法吧
a.shortButton, .button
仅仅是扩展一个类名,对原样式没有任何影响!
stanley8315 2007-12-24
  • 打赏
  • 举报
回复
谢谢了,其实我最想知道的是input有没有办法调用a的CSS属性呢,如果可以怎么修改呢?因为提交的是链接形式,
而CSS中对链接的hove,active,link,visited都设了属性,如果不能调用,那么为了保持风格一致,必须为
input再设置CSS属性。
yixianggao 2007-12-24
  • 打赏
  • 举报
回复
现在一样了!
L@_@K
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="Gao YiXiang" />
<meta name="email" content="yixianggao@126.com" />
<meta name="keywords" content="javascript dhtml dom" />
<meta name="description" content="I love web development." />
<style type="text/css">
.shortButton
{
border-width: 0px;
display:block;
background-color: yellow;
background-image: url(images/short-button.jpg);
background-repeat: no-repeat;
width: 63px;
height: 19px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
</style>
</head>
<body>
<a href="http://community.csdn.net/" class="shortButton">csdn</a><br />
<input type="reset" id="btnReset" value="重置" class="shortButton" /><br />
<a href="javascript:form();"class="shortButton">submit</a>

</body>
</html>
stanley8315 2007-12-24
  • 打赏
  • 举报
回复
谢谢你的回答。不过这么改好后有个奇怪的问题,在这个重置键后面还有个提交,是使用了a.shortbutton的属性,但是两者的效果完全不同。
<a href="javascript:form();"class="shortButton">[@s.text name='message.form.submit'/]</a>
提交键的代码在这里,这个是什么原因呢?
yixianggao 2007-12-24
  • 打赏
  • 举报
回复
或者去掉一点儿也行,反正要改,哈
L@_@K

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="Gao YiXiang" />
<meta name="email" content="yixianggao@126.com" />
<meta name="keywords" content="javascript dhtml dom" />
<meta name="description" content="I love web development." />
<style type="text/css">
.shortButton
{
display:block;
background-color: yellow;
background-image: url(images/short-button.jpg);
background-repeat: no-repeat;
width: 63px;
height: 19px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
</style>
</head>
<body>
<a href="http://community.csdn.net/" class="shortButton">csdn</a><br />
<input type="reset" id="btnReset" value="重置" class="shortButton" />
</body>
</html>
yixianggao 2007-12-24
  • 打赏
  • 举报
回复
更正:改一点儿就行!
一点儿都不改滴方法俺不会,哈
L@_@K

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="Gao YiXiang" />
<meta name="email" content="yixianggao@126.com" />
<meta name="keywords" content="javascript dhtml dom" />
<meta name="description" content="I love web development." />
<style type="text/css">
a.shortButton, .button
{
display:block;
background-color: transparent;
background-image: url(images/short-button.jpg);
background-repeat: no-repeat;
width: 63px;
height: 19px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
</style>
</head>
<body>
<input type="reset" id="btnReset" value="重置" class="button" />
</body>
</html>
stanley8315 2007-12-24
  • 打赏
  • 举报
回复
我试试,谢谢,不过如果不修改CSS的情况下是否可以调用呢?
yixianggao 2007-12-24
  • 打赏
  • 举报
回复
复制、粘贴,哈
L@_@K
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title> new document </title>
<meta name="generator" content="editplus" />
<meta name="author" content="Gao YiXiang" />
<meta name="email" content="yixianggao@126.com" />
<meta name="keywords" content="javascript dhtml dom" />
<meta name="description" content="I love web development." />
<style type="text/css">
a.shortButton
{
display:block;
background-color: transparent;
background-image: url(images/short-button.jpg);
background-repeat: no-repeat;
width: 63px;
height: 19px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
.shortButton
{
display:block;
background-color: transparent;
background-image: url(images/short-button.jpg);
background-repeat: no-repeat;
width: 63px;
height: 19px;
text-align: center;
font-family: Arial, Helvetica, sans-serif;
font-size: 100%;
font-weight: bold;
text-decoration: none;
}
</style>
</head>
<body>
<input type="reset" value="重置" class="shortButton" />
</body>
</html>

61,129

社区成员

发帖
与我相关
我的任务
社区描述
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。
社区管理员
  • HTML(CSS)社区
加入社区
  • 近7日
  • 近30日
  • 至今
社区公告
暂无公告

试试用AI创作助手写篇文章吧