2012-04-23 53 views
-1

我正在用jQuery移动应用程序。在我的登录屏幕上,我有一个提交按钮。在这个按钮上,我想应用这个CSS类。输入按钮将不会使用正确的CSS类

input.submit { 
    font-family: Arial, Helvetica, sans-serif; 
    font-size: 14px; 
    color: #ffffff; 
    padding: 8px 20px; 
    background: -moz-linear-gradient(
     top, 
     #007ca5 0%, 
     #8080f5); 
    background: -webkit-gradient(
     linear, left top, left bottom, 
     from(#007ca5), 
     to(#8080f5)); 
    border-radius: 10px; 
    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    border: 1px solid #ffffff; 
    -moz-box-shadow: 
     0px 1px 6px rgba(0,0,0,0.9), 
     inset 0px 0px 5px rgba(161,142,016,0.6); 
    -webkit-box-shadow: 
     0px 1px 6px rgba(0,0,0,0.9), 
     inset 0px 0px 5px rgba(161,142,016,0.6); 
    text-shadow: 
     0px -1px 3px rgba(255,255,255,0), 
     0px 1px 0px rgba(255,255,255,0); 
} 

而且使用这个类像这样在我的HTML

<INPUT name=submit value=Inloggen type=submit class="submit"> 

现在我认为,问题是,我的CSS不够具体。因为当我要看看我的Firebug的代码,我得到这个div

<div class="ui-btn ui-btn-corner-all ui-shadow ui-btn-up-g" data-theme="g" aria-disabled="false"> 
<span class="ui-btn-inner ui-btn-corner-all"> 
<span class="ui-btn-text">Inloggen</span> 
</span> 
<input class="submit ui-btn-hidden" type="submit" value="Inloggen" name="submit" aria-disabled="false"> 
</div> 

所以任何人可以帮助我,我没有让我的CSS更具体的说好。

+1

请问CSS工作或没有?当它工作时,你不需要更具体。 – WolvDev 2012-04-23 07:46:21

+0

究竟是什么问题? – 2012-04-23 07:49:02

+0

你可以分享你的网页的在线链接..... – Kamal 2012-04-23 07:50:50

回答

2

检查是否嵌入jQuery的MOBIEL css文件除权后您的自定义样式表:

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" /> 
    <meta name="apple-mobile-web-app-status-bar-style" content="black"> 
    <link href="Style/jquery.mobile-1.0.1.css" rel="stylesheet" type="text/css" /> 
    <script src="Scripts/jquery-1.7.1.js" type="text/javascript"></script> 
    <script src="Script/jquery.mobile-1.0.1.js" type="text/javascript"></script> 
    <style type="text/css"> 
     input.submit 
     { 
      font-family: Arial, Helvetica, sans-serif; 
      font-size: 14px; 
      color: #ffffff; 
      padding: 8px 20px; 
      background: -moz-linear-gradient(
     top, 
     #007ca5 0%, 
     #8080f5); 
      background: -webkit-gradient(
     linear, left top, left bottom, 
     from(#007ca5), 
     to(#8080f5)); 
      border-radius: 10px; 
      -moz-border-radius: 10px; 
      -webkit-border-radius: 10px; 
      border: 1px solid #ffffff; 
      -moz-box-shadow: 0px 1px 6px rgba(0,0,0,0.9), inset 0px 0px 5px rgba(161,142,016,0.6); 
      -webkit-box-shadow: 0px 1px 6px rgba(0,0,0,0.9), inset 0px 0px 5px rgba(161,142,016,0.6); 
      text-shadow: 0px -1px 3px rgba(255,255,255,0), 0px 1px 0px rgba(255,255,255,0); 
     } 
    </style> 
    <script type="text/javascript"> 



    </script> 
</head> 
<body> 
    <form> 
    <div data-role="page"> 
     <div data-role="content"> 
      <input name="submit" value="Inloggen" type="submit" class="submit"> 
     </div> 
    </div> 
    </form> 
</body> 
</html>