![如何用css设置网页字体[多图]](/aiimages/%E5%A6%82%E4%BD%95%E7%94%A8css%E8%AE%BE%E7%BD%AE%E7%BD%91%E9%A1%B5%E5%AD%97%E4%BD%93%5B%E5%A4%9A%E5%9B%BE%5D.png)
通过使用HTML5的 Screen Orientation API, 可以在JavaScript定义屏幕方向。
所以用JS实现：
<video width="658" height="444" src="av.mp4" autoplay="autoplay"></video>
在页面加载完成后 获取浏览器高度以及宽度，再设置VIDEO元素高度宽度即可。
<script type="text/javascript">
function resizeBody() {
var bodyHeight = document.documentElement.clientHeight
$("#Flash1").height(bodyHeight + "px")
$("body").height(bodyHeight + "px")
}
$(function () {
resizeBody()
})
</script>
<body style=" width:100% height:100%" onresize="resizeBody()">
附上HTML5中如何判断横屏竖屏：
1.首先在head中加入如下代码：
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
针对上述viewport标签有如下说明：
1)content中的width指的是虚拟窗口的宽度。
2)user-scalable=no就一定可以保证页面不可以缩放吗？NO，有些浏览器不吃这一套，还有一招就是minimum-scale=1.0, maximum-scale=1.0 最大与最小缩放比例都设为1.0就可以了。
3)initial-scale=1.0 初始缩放比例受user-scalable控制吗？不一定，有些浏览器会将user-scalable理解为用户手动缩放，如果user-scalable=no，initial-scale将无法生效。
4)手机页面可以触摸移动，但是如果有需要禁止此操作，就是页面宽度等于屏幕宽度是页面正好适应屏幕才可以保证页面不能移动。
5)如果页面是经过缩小适应屏幕宽度的，会出现一个问题，当文本框被激活（获取焦点）时，页面会放大至原来尺寸。
2.判断横屏竖屏：
1》CSS判断横屏竖屏：
写在同一个CSS中：
@media screen and (orientation: portrait) {/*竖屏 css*/
}
@media screen and (orientation: landscape) {
/*横屏 css*/
}
分开写在2个CSS中：
竖屏
<link rel="stylesheet" media="all and (orientation:portrait)"href="portrait.css">
横屏
<link rel="stylesheet" media="all and (orientation:landscape)"href="landscape.css">
2》JS判断横屏竖屏：
//判断手机横竖屏状态：window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
if (window.orientation === 180 || window.orientation === 0)
{ alert('竖屏状态！') }
if (window.orientation === 90 || window.orientation === -90 )
{ alert('横屏状态！') } }, false)//移动端的浏览器一般都支持window.orientation这个参数，通过这个参数可以判断出手机是处在横屏还是竖屏状态。
可以适应移动设备的横竖屏，但是有的设备还是会有点问题，你可以分别写：/*竖屏*/
@media all and (orientation : portrait){
body {
background-color: #00ff00
}
}
/*横屏*/
@media all and (orientation : landscape) {
body {
background-color: #ff0000
}
}
HTML5的前景是非常好的，企业现在安卓、iOS开发人员都在学习HTML5混合开发，节约成本、一专多能是未来很多企业用人趋势！HTML5工程师在今后的工作中与Android、iOS工程师对接的几率非常大。混合式开发思想培训出来的学员比单一课程学员薪水高至少2000元，同时企业也更愿意去花更多的钱来聘请那些了解比较全面的开发人员！混合式开发讲师需要同时精通Android、iOS、HTML5等多门课程，这样才能在教学过程中融合混合式开发思想，让学员能够同时了解一些与本课程最相关的技术，为学员今后在工作中的对接和配合工作提供极大助力，对学员今后的职业发展也会有很大帮助。可以参加HTML5培训班的学习，拥有“混合式开发特聘讲师”这一大特色的，混合式开发课程对讲师的要求非常之高，至少同时具备3年或以上教学和技术经验的讲师才可以胜任，这是其他机构无法提供的！学习主要也是靠自己的，现在HTML5很火，前景未来5~10年内绝对好，好好学习拿高薪工作是没问题的。
