解决android webkit的css postion:fixed支持问题【转】
2011-06-14 11:48
399 查看
解决android webkit的css postion:fixed支持问题
android webkit不能支持postion:fixed,导致无法设计网页上的菜单在页面上下滚动时固定在一个位置。解决方法如下:
在Html中加入以下meta属性(适用于android 2.2 / 2.3)
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
示例页面如下:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />
<title> Android Fixed-Position Scrolling Demo</title>
<style type="text/css">
.ft {
position:fixed;
width:100%;
text-align:center;
font-weight:bold;
}
div, ul, li {
margin:0;
padding:0;
}
li {
list-style:none;
height:44px;
line-height:44px;
padding-left:10px;
border-bottom:1px solid #eee;
}
</style>
</head>
<body>
<div class="ft"> Fixed Headers</div>
<div id="bd">
<ul>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
<li>item</li>
</ul>
</div>
</body>
</html>
相关文章推荐
- 解决android webkit的css postion:fixed支持问题
- 解决android webkit的css postion:fixed支持问题
- 实现 IE6 下支持 position-fixed 的 CSS 属性并解决“振动”的问题
- 解决 iOS webkit 使用CSS动画时闪烁的问题
- 解决IE8以下浏览器不支持CSS属性opacity的问题
- 解决android数据库降级时,sqlite不支持drop column的问题
- 完美解决IE6不支持position:fixed的bug问题
- CSS position:fixed定位时 “高度坍塌” 问题的解决
- 移动端fixed + Input 调用键盘的时候fixed无效问题(css解决)
- 解决支持库版本兼容问题:all com.android.support libraries must use the exact same version specification
- Android添加新版本支持包V7后自定义ActionBar左侧有空白,不能玩全填充问题解决
- Android 解决WebView 支持WebGL兼容性问题
- Android Webview完美支持播放各种视频。(解决无法播放优酷视频的问题以及周末无法播放优酷视频的问题)
- Android添加新版本支持包V7后自定义ActionBar左侧有空白,不能玩全填充问题解决
- Android 自绘TextView解决提前换行问题,支持图文混排
- [转]解决IE/Mozilla/Webkit/Opera兼容问题的葵花宝典:CSS Bug Table
- IE6下position:fixed不支持问题及其解决方式
- [Android--Tool]更新SDK后ADT版本低不支持问题的解决
- Android系统中 webkit 内核浏览器position:fixed所造成的兼容问题
- css解决IE6、Chrome、ff 浏览器position:fixed;和闪动问题