有人可以在这里分享一个脚本,使我的网页按钮外观和感觉像Facebook的或至少在某种程度上。提前致谢。我很想知道这一点,因为在CSS的帮助下已经有7天的时间尝试这么做了,但是没有成功。请帮帮我。我如何让我的网页按钮看起来像Facebook按钮的按钮?
0
A
回答
2
我会推荐使用类似于Chrome开发工具或Firefox开发工具的工具,并简单地检查一下您想要模仿的样式。 我刚刚发现在Facebook上的按钮,似乎他们正在使用的标签容器这个样式表:
webkit-box-shadow: rgba(0, 0, 0, 0.046875) 0px 1px 0px 0px;
background-attachment: scroll;
background-clip: border-box;
background-color: #DDD;
background-image: none;
background-origin: padding-box;
border-bottom-color: #999;
border-bottom-style: solid;
border-bottom-width: 1px;
border-left-color: #999;
border-left-style: solid;
border-left-width: 1px;
border-right-color: #999;
border-right-style: solid;
border-right-width: 1px;
border-top-color: #999;
border-top-style: solid;
border-top-width: 1px;
color: #666;
cursor: pointer;
direction: ltr;
display: inline-block;
font-family: 'lucida grande', tahoma, verdana, arial, sans-serif;
font-size: 11px;
font-weight: bold;
height: 16px;
line-height: normal;
margin-bottom: 5px;
margin-left: 0px;
margin-right: 0px;
margin-top: 0px;
overflow-y: visible;
padding-bottom: 2px;
padding-left: 6px;
padding-right: 6px;
padding-top: 2px;
text-align: center;
text-decoration: none;
unicode-bidi: normal;
vertical-align: top;
white-space: nowrap;
width: 67px;
只要看看那些什么有用的插件可以告诉你,看看别人是怎么做的CSS。
干杯!
0
您需要做的就是使用CSS为您的按钮指定一些样式。 为了给一个按钮分配样式,你需要设置一些样式为INPUT [type =“submit”]。这里有一个例子:
INPUT[type="submit"]
{
*/ put your styles here */
}
0
欢迎艾米特,
我与蒂姆同意,这很难帮助你不知道你的代码。不过,如果你想从其他网站学习,你可能想看看Firebug。它是Firefox的一个插件,它可以帮助你分析几乎任何给定的非Flash网站的代码。 安装它并右键单击并选择检查元素。
如果您使用谷歌浏览器,这样的功能可以在框外使用,就像bra says说的那样。然而,我发现Firebug更舒适一些,特别是对于新手来说。
你可以通过浏览任何网站和在线编辑东西了解很多。您将立即看到结果并能够分辨出不同的CSS样式。
0
对于一个完整的跨浏览器的解决方案,你可以通过这种方式使用CSS精灵做到这一点(我有紫色精灵形象目前可供选择:d):
精灵图像(光梯度):
标记
<input value="Share" type="button" />
<br /><br />
<input value="Comment" type="button" />
CSS
input[type="button"]{
background: url(spriteImgUrl) repeat-x scroll;
padding: 6px 10px;
color:#FFFFFF;
padding:4px 6px;
font-size:12px;
font-weight:bold;
border:1px solid #3D197C;
cursor:pointer;
}
input[type="button"]:hover{
background-position: 0 -48px;
}
input[type="button"]:active{
background-position: 0 -96px;
}
相关问题
- 1. 如何让我的提交按钮看起来不像按钮?
- 2. 如何让我的按钮看起来像被点击?
- 3. 我该如何让药丸按钮看起来像链接?
- 4. facebook按钮的网站网址按钮
- 5. 设置按钮看起来像默认的安卓按钮
- 6. 如何让Facebook像按钮延迟我的网站加载?
- 7. 黑莓自定义按钮,看起来像默认按钮
- 8. 充分利用FLEX4按钮看起来就像Flex3按钮
- 9. 制作单选按钮看起来像是按钮
- 10. 使默认按钮看起来像正常按钮
- 11. 如何在iPhone SDK中创建一个看起来像UIActionSheet按钮的按钮?
- 12. 如何让任何asp:LinkButton看起来像一个按钮
- 13. 使按钮看起来按下
- 14. Tweet我按钮 - JavaScript按钮
- 15. 如何让AngularJS链接看起来/行为像一个按钮?
- 16. Bootstrap使文本看起来像按钮
- 17. WPF ToggleButton看起来像普通按钮
- 18. 链接看起来像提交按钮
- 19. 我的网站的Facebook登记按钮
- 20. Angularjs FaceBook按钮按钮
- 21. 如何按这样的网页按钮?
- 22. 我需要看起来像这样的按钮输入
- 23. 如何将我的按钮变成图像按钮?
- 24. Facebook页面按钮
- 25. LibGDX - 如何让我的按钮工作?
- 26. Facebook的Like按钮的分享按钮
- 27. 我喜欢按钮 - 很多页面像按钮代码一样
- 28. facebook按钮的问题喜欢按钮
- 29. Facebook Like按钮的网站
- 30. 当我按下按钮时,我的按钮往下掉
这不是一个代码的请求的网站。发布你迄今为止所做的事,也许有人可以帮助你。 – 2011-02-09 14:33:02