2012-12-28 111 views
0

**请注意我用这“http://andymatthews.net/read/2012/02/13/New-jQuery-Mobile-theme:-Twitter-Bootstrap” **引导程序不能程序自定义按钮渐变

原来这就是标准按钮“嵌入”如果你愿意的样子,只是一个简单的一个元素。

<a href="/mobile/daily.cfm" data-rel="dialog" data-role="button" data-transition="pop" data-ajax="false" data-theme="b" class="">Daily Progress</a> 

现在我不确定你们是否熟悉Bootstrapper,但它带有一些预定义的按钮样式。虽然我无法弄清楚如何添加自定义的。我认为这将是在公园散步,但事实证明它不是......或者至少我犯了一个愚蠢的错误或忘记了某件事。

我想用梯度是本

background: #fa5976; /* Old browsers */ 
background: -moz-linear-gradient(top, #fa5976 0%, #fa5573 13%, #fa4c6b 30%, #f6374e 100%); /* FF3.6+ */ 
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fa5976), color-stop(13%,#fa5573), color-stop(30%,#fa4c6b), color-stop(100%,#f6374e)); /* Chrome,Safari4+ */ 
background: -webkit-linear-gradient(top, #fa5976 0%,#fa5573 13%,#fa4c6b 30%,#f6374e 100%); /* Chrome10+,Safari5.1+ */ 
background: -o-linear-gradient(top, #fa5976 0%,#fa5573 13%,#fa4c6b 30%,#f6374e 100%); /* Opera 11.10+ */ 
background: -ms-linear-gradient(top, #fa5976 0%,#fa5573 13%,#fa4c6b 30%,#f6374e 100%); /* IE10+ */ 
background: linear-gradient(to bottom, #fa5976 0%,#fa5573 13%,#fa4c6b 30%,#f6374e 100%); /* W3C */ 
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fa5976', endColorstr='#f6374e',GradientType=0); /* IE6-9 */ 

使用梯度发生器产生该梯度。渐变只是一种中等粉色的风格。

现在,我认为这只是复制“b”风格,并创建一个新的“x”,“z”,“p”等风格,但显然这是行不通的。

这里是“b”风格看起来很长,所以我只会发布一个链接到pastebin。 (http://pastebin.com/Jz0JhsPq)。

现在,我想我可以做这样的事情(http://pastebin.com/4h4rhscH),然后更改菜单项,像这样

<a href="/mobile/daily.cfm" data-rel="dialog" data-role="button" data-transition="pop" data-ajax="false" data-theme="p" class="">Daily Progress</a> 

但没有奏效,它只是让他们发白的灰色。我真的可以在这里使用一些帮助,任何支持将不胜感激。

非常感谢!

回答

1

这可以相对容易地完成。

就是这样。