您的位置：首页 > 其它

网页内容宽高适配

2016-01-19 15:36 197 查看

参考

http://www.w3chtml.com/css3/properties/madia-queries/device-height.html

device-height：length

用长度值来定义高度。不允许负值

说明：

定义输出设备的屏幕可见高度。

本特性接受min和max前缀，因此可以派生出min-device-height和max-device-height两个媒体特性

min-device-height : 定义范围下限，等于或超过这个范围的高度才执行下面的代码

max-device-height :定义范围上限，等于或小于这个范围的高度才执行下面的代码

例如：

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>media features device-height_CSS参考手册_web前端开发参考手册系列</title>
<style>
@media screen and (min-device-height:800px){
body{color:#f00;}
}
</style>
</head>
<body>
<div class="test">当你的输出设备分辨率高度大于等于800px时，本行文字显示为红色</div>
</body>
</html>

<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8" />
<title>media features device-height_CSS参考手册_web前端开发参考手册系列</title>
<style>
@media screen and (max-device-height:736px){
body{color:#f00;}
}
</style>
</head>
<body>
<div class="test">当你的输出设备分辨率高度小于等于736px时，本行文字显示为红色</div>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航