CSS div按钮不适用于Iphone或Ipad [英] CSS div buttons not working on Iphone or Ipad
问题描述
我正在为我的学校开发一个基于CSS的手机,平板电脑和桌面版本的网络应用程序。我正在使用媒体查询。该应用程序几乎完成,它几乎在所有浏览器和Android上都能正常运行。该应用程序在Iphone / Ipad上看起来很棒但是按钮不起作用使得应用程序在这些设备中无用。
I am working on a web base app for my school with different versions of CSS for handheld, tablet and desktop. I am using media queries for this. The app is almost done and it works correctly on almost all browsers and android. The app looks awesome on Iphone/Ipad however buttons do not work making the app useless in these devices.
这就是我所拥有的:
//Source code
<div id="signinbutton" class="blue_button">Sign In</div>
//desktop.CSS
.blue_button {
width: 130px;
height: auto;
padding: 8px;
margin: 0% auto 20% auto;
background-image:url(../../images/bluebar5.png);
color: #FFF;
text-align: center;
font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
font-size: 14pt;
font-weight: bolder;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
cursor: default;
}
.blue_button:hover {
opacity: 0.7;
}
//Handheld.css (this overwrites css on desktop)
.blue_button {
width: 260px;
font-size: 18pt;
background-image:url(../../images/bluebar6.png);
}
我尝试将样式应用于#signinbutton但没有成功。
I tried applying the style to #signinbutton without success.
推荐答案
您应该使用< button>
或< input type =button>
标记而不是div。虽然< div>
按钮功能可能在某些浏览器中有效,但与传统按钮标签相比,它可能有点黑客
You should use a <button>
or <input type="button">
tag instead of a div. While the <div>
button functionality may work in some browsers, it can be a bit of a hack compared to the traditional button tags
这篇关于CSS div按钮不适用于Iphone或Ipad的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!