输入(HTML5)改变其形状为上iphone

圆我做了简单的输入和发送键,但问题是,与我的iPhone的Safari/Chrome中,输入改变它的形式来圈,和文本ID改变其位置,归结......为什么这些情况发生,当我去从桌面(PC)那里铬你可以右键点击并去检查,并与不同的设备检查乌拉圭回合的网站,它表明,一切都应该在iPhone上好的,但是当我去到iPhone它不是...输入(HTML5)改变其形状为上iphone

<!DOCTYPE html> 
 
<html> 
 
<head> 
 

 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
 

 

 
<style> 
 
#title{ 
 
    font-size:100px; 
 
} 
 
input{ 
 
position:absolute; 
 
    top: 200px; 
 
height:150px; 
 
width:340px; 
 
size:35px; 
 
background-color: ; 
 
font-size:60px; 
 

 

 
} 
 
button{ 
 
font-size:60px; 
 
position:absolute; 
 
    left: 350px; 
 
    top: 200px; 
 
    margin: 0px; 
 
height:150px; 
 
width:150px; 
 
background-color: #EEE; 
 
padding: 0px; 
 
} 
 
</style> 
 
</head> 
 
<body> 
 

 
<div id="title"> 
 
<p>Packet ID </p> 
 
</div> 
 

 
<input type="search" > 
 
<button type="button">Send</button> 
 
    
 
</body> 
 
</html>

Joonas Karppinen

@tobiv你知道,为什么“ID”文本,从“数据包ID“在iphone safari下降? –

我不 - 可能是因为它不适合屏幕? –

@tobiv但为什么当我写PacketID时,它的工作原理并不像这样Packet ID –

回答

在你的CSS添加此标准溶液:

button { 
    -webkit-appearance: none; 
    -webkit-border-radius: 0; 
border-radius: 0; 

} 

Balwant

嘿,这个工程,但你能给我理由,为什么它没有工作,为什么这修复? –

请参阅有关iPhone的Safari这个线程https://stackoverflow.com/questions/2918707/turn-off-iphone-safari-input-element-rounding –

你知道,为什么“ID”文本,从“分组ID”下来 ? –

输入(HTML5)改变其形状为上iphone